js跟随鼠标移动的天使经典案例教程附代码源码

[复制链接]
查看1945 | 回复0 | 2020-6-4 17:00 | 显示全部楼层 |阅读模式
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4.     <meta charset="UTF-8">
  5.     <title>Title</title>
  6.     <style>
  7.         img{
  8.             position:absolute;
  9.             top:0;
  10.             left:0;
  11.         }
  12.     </style>
  13. </head>
  14. <body>
  15. <img src="images/angel(1).gif" alt="">
  16. <script>
  17.     var img=document.querySelector("img");
  18.     document.addEventListener('mousemove',function(e){
  19.         var x=e.pageX;
  20.         var y=e.pageY;
  21.         img.style.left=x-50+"px";
  22.         img.style.top=y-40+"px";
  23.     })
  24. </script>
  25. </body>
  26. </html>
复制代码
document.addEventListener('mousemove',function(e) 这个要注意下,绑定的是文档。
您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

UID
1
贡献
387
丢币
38902
主题
4607
回帖
116
注册时间
2018-9-25
最后登录
2024-4-16