代码｜WordPress美化教程网站添加爱国富强民主鼠标点击特效

很多做WordPress个人站点、博客网站的朋友，都想给页面增加一点正能量的装饰小动画，这次微界资源网分享的一套点击鼠标弹出爱国富强民主价值观标语的鼠标点击特效代码。点击页面任意位置，就会随机飘出富强、民主、爱国等文字，搭配缓缓上浮渐隐的动态效果，既能美化页面，也传递正向价值观，加载完全不会拖慢网页速度。

整套特效依靠 jQuery 实现交互逻辑，WordPress 程序只需要把代码粘贴到主题的 footer.php 底部文件即可完成部署，操作门槛很低，不懂复杂代码修改的新手也能上手。动画自带位移、透明渐变过渡，自由度很高，想要调整文字内容、字体大小、文字颜色，直接在源码里修改对应参数就能生效，不会和网站原有样式产生冲突，兼容性表现很稳定。

安鹿也分享过其他好玩代码，有需要的可以在微界资源网󠇖󠆍󠆕󠇘󠅷󠆚󠇕󠆞󠅹󠇙󠆩󠆯󠇘󠆭󠆙󠅧󠅧󠅧󠄞󠅑󠅞󠅜󠅥󠄡󠄣󠄡󠄤󠄞󠅓󠅟󠅝zy.weiaj.com搜一下关键词。

代码｜HTML可爱神兽/佛祖保佑代码 趣味祈福网页挂件

代码｜QQ打开网页跳转浏览器提示源码 解决QQ访问站点屏蔽拦截优化技巧

代码亮点

1.代码体量小，加载快，不拖慢网站速度，全设备兼容流畅运行

2.文字颜色、大小、动画效果均可直接修改，自定义自由度高

3.WordPress 只需粘贴到底部文件，无需插件，删除即可一键关闭

示范截图

使用方法

WordPress网站直接添加到footer.php文件的</body>之前，如果添加后未生效请尝试清理CDN缓存或者浏览器缓存就可以了。

代码

//https://zy.weiaj.com/
<script type="text/javascript"> var a_idx = 0; jQuery(document).ready(function($) { $("body").click(function(e)
 { var a = new Array("富强", "民主", "文明", "和谐", "自由", "平等", "公正" ,"法治", "爱国", "敬业", "诚信", "友善"); 
var $i = $("<span/>").text(a[a_idx]); a_idx = (a_idx + 1) % a.length; 
var x = e.pageX, y = e.pageY; $i.css({ "z-index": 999999999999999999999999999999999999999999999999999999999999999999999, "top": y - 20, 
"left": x, "position": 
"absolute",
 "font-weight": "bold", 
"color": "#ff6651" }); $("body").append($i); $i.animate({ "top": y - 180, "opacity": 0 }, 1500, function() { $i.remove(); }); }); }); 
</script>