分享一个鼠标点击红色数字上升的代码

流年
流年
流年
294
文章
377
评论
2016年4月5日09:02:3141,227 456字阅读1分31秒

在狠多网站上都看见过这个特效,觉得挺有趣的,喜欢的可以折腾一下!

 

效果图:分享一个鼠标点击红色数字上升的代码

 

代码:

 

  1. /*
  2. 红色数字上升特效
  3. */
  4. var _click_count=0;
  5. $("body").bind("click",function(e){ //直接给body一个事件好了.
  6. //var n=Math.round(Math.random()*100);//随机数
  7. var $i=$("<b>").text("+"+(++_click_count));//添加到页面的元素
  8. var x=e.pageX,y=e.pageY;//鼠标点击的位置
  9. $i.css({
  10. "z-index":99999,
  11. "top":y-15,
  12. "left":x,
  13. "position":"absolute",
  14. "color":"DeepSkyBlue"
  15. });
  16. $("body").append($i);
  17. $i.animate(
  18. {"top":y-180,"opacity":0},
  19. 1500,
  20. function(){$i.remove();}
  21. );
  22. e.stopPropagation();
  23. });
流年
  • 本文由 发表于 2016年4月5日09:02:31
  • 除非特殊声明,本站文章均为原创,需要转载,请留言说明!
匿名

发表评论

匿名网友 填写信息

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

评论:4   其中:访客  4   博主  0
    • Young小杰 Young小杰 1

      这个挺好看的

      • 米粒博客 米粒博客 4

        之前在别人那看过 还以为是啥呢

        • 历史上的今天 历史上的今天 1

          当娱乐还是挺好的

          • 懿古今 懿古今 3

            这个确实在一些博客上看到过,不过这种需求一般人还真用不上