标签： Js特效

特效介绍

引用文件后，从网页底部向上漂浮蓝色星星。

比较好看，但是css代码太长，建议单文件引用，不要复制到style.css里

还有html代码也比较长，注意不要放错地方，具体的看视频教程吧

如果div代码过长，影响观感，可以找个html转js的工具，将html代码转换为js代码。

然后直接在你想展示在的代码内，调用你的转换js文件，输出即可。

视频教程

[content_hide]

[/content_hide]

代码介绍

这个代码实现了一个点击页面时生成彩色心形动画效果的功能。具体来说，当用户点击页面任意位置时，会在点击位置生成多个彩色的心形图案，这些心形图案会逐渐上升并消失。

视频介绍

[content_hide]

[/content_hide]

代码效果

在页面上点击鼠标时，生成随机的emoji表情，这些表情从鼠标位置开始出现，然后移动并逐渐消失。

视频介绍

[content_hide]

[/content_hide]

资源介绍一个JS烟花效果，很久之前的代码了，可以拿去研究一下。圆点大小自己研究代码调整，已经做了详细的注释。

代码说明（任选一种方法）

方法一：放在主题/子主题的header.php中，注意代码的上下位置，js引入文件应该在下面。

方法二：放在主题/子主题的footer.php中(最下面)，注意代码的上下位置，js引入文件应该在下面。

注意修改JS引用路径，要和自己的js文件位置对应，如果你对代码较为熟悉，可以随意放置代码。

相关代码

<?php if(!wp_is_mobile()): ?>
<div id="clickCanvas" style=" position:fixed;left:0;top:0;z-index:999999999;pointer-events:none;"></div>
<?php endif; ?>

<script src="/wp-content/themes/b2child/diy/js/yanhua.js"></script>

如果想让手机端也显示，删除php标签代码

<div id="clickCanvas" style=" position:fixed;left:0;top:0;z-index:999999999;pointer-events:none;"></div> 

<script src="/wp-content/themes/b2child/diy/js/yanhua.js"></script>

 
[content_hide]

[/content_hide]