鼠标点击特效代码
分享一段html鼠标点击特效代码,这段点击特效代码适合用在各种网站页面上面,只要有访客点击鼠标,网站界面上面点击过的地方就会出现特效,非常的好看,而且还可以增加用户的娱乐性,减少网站的跳出率。
这段代码感觉还是很不错的,只需要把这个代码放到网站页面当中,就可以实现鼠标点击特效了,这个特效的图标文字都是可以自行修改的,非常的适合网站建设,平时我们网站看起来比较单调,只有一些内容,但是排版和界面布局就比较随意,用户访问的多了也就会出现厌倦,时间长了我们网站的访问率有可能会减少,但是添加一个鼠标点击特效的代码,用户只要在网站页面任意位置点击鼠标,都可以出现特效动画,这种操作还是比较有趣的,而且用户也不会觉得无聊,所以网站添加鼠标点击特效还是很有用的。
只需要将下面代码放到想要出现点击特效的网站页面文件的</body>之前,就可以实现用户鼠标点击特效,只要他们在页面中点击鼠标,就会出现特效。
<!-- 鼠标点击特效代码开始 --> <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> <!-- 鼠标点击特效代码结束 -->
发表评论