标签:
一个div跟着一个div运动,第一个div跟着鼠标运动,就可以有一串div跟着鼠标运动起来
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>无标题文档</title> <style> div{width:10px; height:10px; background:#F00; position:absolute;} </style> <script> function getPos(ev) { var scrollTop=document.documentElement.scrollTop||document.body.scrollTop; var scrollLeft=document.documentElement.scrollLeft||document.body.scrollLeft; return {x:ev.clientX+scrollLeft,y:ev.clientY+scrollTop}; } document.onmousemove=function(ev) { var aDiv=document.getElementsByTagName(‘div‘); var aEvent=ev||event; for(var i=aDiv.length-1;i>0;i--){ aDiv[i].style.left=aDiv[i-1].offsetLeft+‘px‘;//后一个跟着前一个div移动 aDiv[i].style.top=aDiv[i-1].offsetTop+‘px‘; } var pos=getPos(aEvent); aDiv[0].style.left=pos.x+‘px‘; aDiv[0].style.top=pos.y+‘px‘; } </script> </head> <body> <div></div> <div></div> <div></div> <div></div> <div></div> <div></div> <div></div> <div></div> <div></div> <div></div> <div></div> <div></div> <div></div> <div></div> <div></div> <div></div> <div></div> <div></div> <div></div> <div></div> <div></div> <div></div> <div></div> <div></div> <div></div> <div></div> <div></div> <div></div> <div></div> <div></div> <div></div> <div></div> <div></div> <div></div> <div></div> <div></div> <div></div> <div></div> <div></div> </body> </html>
标签:
原文地址:http://www.cnblogs.com/lzzhuany/p/4542732.html