鼠标点击特效代码

分享一段html鼠标点击特效代码,这段点击特效代码适合用在各种网站页面上面,只要有访客点击鼠标,网站界面上面点击过的地方就会出现特效,非常的好看,而且还可以增加用户的娱乐性,减少网站的跳出率。

这段代码感觉还是很不错的,只需要把这个代码放到网站页面当中,就可以实现鼠标点击特效了,这个特效的图标文字都是可以自行修改的,非常的适合网站建设,平时我们网站看起来比较单调,只有一些内容,但是排版和界面布局就比较随意,用户访问的多了也就会出现厌倦,时间长了我们网站的访问率有可能会减少,但是添加一个鼠标点击特效的代码,用户只要在网站页面任意位置点击鼠标,都可以出现特效动画,这种操作还是比较有趣的,而且用户也不会觉得无聊,所以网站添加鼠标点击特效还是很有用的。

鼠标点击特效代码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>
<!-- 鼠标点击特效代码结束 -->

免责声明:

本站提供的资源,都来自网络,版权争议与本站无关,所有内容及软件的文章仅限用于学习和研究目的。不得将上述内容用于商业或者非法用途,否则,一切后果请用户自负,我们不保证内容的长久可用性,通过使用本站内容随之而来的风险与本站无关,您必须在下载后的24个小时之内,从您的电脑/手机中彻底删除上述内容。如果您喜欢该程序,请支持正版软件,购买注册,得到更好的正版服务。侵删请致信E-mail:ys0006@163.com

标签

发表评论