本篇文章给大家分享的是有关使用javascript如何为鼠标设置特效,小编觉得挺实用的,因此分享给大家学习,希望大家阅读完这篇文章后可以有所收获,话不多说,跟着小编一起来看看吧。JavaScript是什么js是JavaScript的简称,它
本篇文章给大家分享的是有关使用javascript如何为鼠标设置特效,小编觉得挺实用的,因此分享给大家学习,希望大家阅读完这篇文章后可以有所收获,话不多说,跟着小编一起来看看吧。
js是JavaScript的简称,它是一种直译式的脚本语言,其解释器被称为JavaScript引擎,是浏览器的一部分,主要用于WEB的开发,可以给网站添加各种各样的动态效果,让网页更加美观。
1、网页上制作添加鼠标点击特效
<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": 9999,"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>
2、网页上制作鼠标跟随的特效
<!DOCTYPE html><html><head><meta charset="UTF-8"><title></title><script></script></head><body><div id="div1">鼠标跟随文字</div><script>var div=document.getElementById("div1");document.οnmοusemοve=function(event){pos(div,10,20,event);}function pos(o,x,y,event){var posX=0; var posY=0;var e=event || window.event;//兼容IE浏览器if(e.pageX || e.pageY)//如果支持pageX或者pageY{posX=e.pageX;posY=e.pageY;}else if(e.clientX || e.clientY){posX=e.clientX+document.documentElement.scrollLeft+document.body.scrollLeft;posY=e.clientY+document.documentElement.scrollTop+document.body.scrollTop;}o.style.position="absolute";o.style.left=(posX+x)+"px";o.style.top=(posY+y)+"px";}</script></body></html>
以上就是使用javascript如何为鼠标设置特效,小编相信有部分知识点可能是我们日常工作会见到或用到的。希望你能通过这篇文章学到更多知识。更多详情敬请关注编程网精选频道。
--结束END--
本文标题: 使用javascript如何为鼠标设置特效
本文链接: https://lsjlt.com/news/273221.html(转载时请注明来源链接)
有问题或投稿请发送至: 邮箱/279061341@qq.com QQ/279061341
2024-05-24
2024-05-24
2024-05-24
2024-05-24
2024-05-24
2024-05-24
2024-05-24
2024-05-24
2024-05-24
2024-05-24
回答
回答
回答
回答
回答
回答
回答
回答
回答
回答
0