jquery实现图片跟随鼠标的实例

时间:2021-05-26

jquery实现图片跟随鼠标的实例

开发后台写页面困难的一比啊,想写个鼠标移动某连接右侧显示二维码,并跟随鼠标移动的功能,各种查资料,花了一小天终于搞出来了,代码的记下来,浪费了我这么多时间,记你一辈子,这个可以直接在W3School直接运行,可以根据某行显示某个特定的图片,自己定义就行

实现代码:

<html> <head> <script src="http://libs.baidu.com/jquery/2.0.0/jquery.js"></script> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>jquery图片跟随鼠标</title> <script type="text/javascript"> function hideImg(num){ if(num.className == "1_name"){ $('#1_erweima').hide(); }else if(num.className == "2_name"){ $('#2_erweima').hide(); } } function showImg(num) { var intX = window.event.clientX; var intY = window.event.clientY; if (num.className == "1_name") { $('#1_erweima').css("left", intX + 20 + "px"); $('#1_erweima').css("top", intY + 10 + "px"); $('#1_erweima').show(); } else if (num.className == "2_name") { $('#2_erweima').css("left", intX + 20 + "px"); $('#2_erweima').css("top", intY + 10 + "px"); $('#2_erweima').show(); } } </script> </head> <body> <table> <tr> <th> <a href="https:///5aV1bjqh_Q23odCf/static/superman/img/logo_top_ca79a146.png" /> </div> </table> </body> </html>

如有疑问请留言或者到本站社区交流讨论,感谢阅读,希望能帮助到大家,谢谢大家对本站的支持!

声明:本页内容来源网络,仅供用户参考;我单位不保证亦不表示资料全面及准确无误,也不保证亦不表示这些资料为最新信息,如因任何原因,本网内容或者用户因倚赖本网内容造成任何损失或损害,我单位将不会负任何法律责任。如涉及版权问题,请提交至online#300.cn邮箱联系删除。

相关文章