Single

JS特效教程:给网站添加鼠标点击弹出指定汉字特效

网站添加鼠标点击弹出指定汉字特效,就是鼠标点击站点任何位置,都会随机弹出我们指定的一组汉字中的一个。比如指定“文明,自由,民主,公正,和谐”等,点击鼠标时就会随机显示这一组的某个词语,具体点击效果请移步『』亲自体验,或见下图:

这个特效不单单适用于 WordPress 博客网站,其他的网站包括但不限于 zblog、HTML 构建的网站都可以实现,只需要将以下 JS 代码添加到页脚的 标签的前面即可。

  1. <script type=“text/javascript”></script type=
  2. /*天真网(tzw520.cn) 鼠标特效 */
  3. var a_idx = 0;
  4. jQuery(document).ready(function($) {
  5.     $(“body”).click(function(e) {
  6.         var a = new Array(“天真”,“富强”“民主”“文明”“和谐”“自由”“平等”“公正” ,“法治”“爱国”“敬业”“诚信”“友善”);
  7.         var $i = $().text(a[a_idx]);
  8.         a_idx = (a_idx + 1) % a.length;
  9.         var x = e.pageX,
  10.         y = e.pageY;
  11.         $i.css({
  12.             “z-index”: 999999999999999999999999999999999999999999999999999999999999999999999,
  13.             “top”: y – 20,
  14.             “left”: x,
  15.             “position”“absolute”,
  16.             “font-weight”“bold”,
  17.             “color”“#ff6651”
  18.         });
  19.         $(“body”).append($i);
  20.         $i.animate({
  21.             “top”: y – 180,
  22.             “opacity”: 0
  23.         },
  24.         1500,
  25.         function() {
  26.             $i.remove();
  27.         });
  28.     });
  29. });

其中 Array(“天真”,”富强”, “民主”, “文明”, “和谐”, “自由”, “平等”, “公正” ,”法治”, “爱国”, “敬业”, “诚信”, “友善”)里面的汉字可以随便修改组合,也可以适当增加或删除,一切随意就好。还有,如果觉得点击弹出的汉字往上跑得太快的话,你可以将以上代码中的 1500 改为 3000 或者更大的数值即可。