核心提示:一串跟随鼠标的p。!DOCTYPE htmlhtmlheadmeta charset=UTF-8title一串跟随鼠标的p/titlestylep{height: 100px; width:150px...
一串跟随鼠标的p。
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>一串跟随鼠标的p</title> <style> p{height: 100px; width:150px; position: absolute;} img{height: 100px; width:150px;} </style> </head> <body> <p><img src="img/3.jpg"></p> <p><img src="img/3.jpg"></p> <p><img src="img/3.jpg"></p> <p><img src="img/3.jpg"></p> <p><img src="img/3.jpg"></p> <p><img src="img/3.jpg"></p> <p><img src="img/3.jpg"></p> <p><img src="img/3.jpg"></p> <p><img src="img/3.jpg"></p> <p><img src="img/3.jpg"></p> <p><img src="img/3.jpg"></p> <p><img src="img/3.jpg"></p> <p><img src="img/3.jpg"></p> <p><img src="img/3.jpg"></p> <p><img src="img/3.jpg"></p> <p><img src="img/3.jpg"></p> <p><img src="img/3.jpg"></p> <p><img src="img/3.jpg"></p> <p><img src="img/3.jpg"></p> <p><img src="img/3.jpg"></p> <p><img src="img/3.jpg"></p> <p><img src="img/3.jpg"></p> <p><img src="img/3.jpg"></p> <p><img src="img/3.jpg"></p> <p><img src="img/3.jpg"></p> <p><img src="img/3.jpg"></p> <p><img src="img/3.jpg"></p> <p><img src="img/3.jpg"></p> <p><img src="img/3.jpg"></p> <p><img src="img/3.jpg"></p> <p><img src="img/3.jpg"></p> <p><img src="img/3.jpg"></p> <p><img src="img/3.jpg"></p> <p><img src="img/3.jpg"></p> <p><img src="img/3.jpg"></p> <p><img src="img/3.jpg"></p> <p><img src="img/3.jpg"></p> <p><img src="img/3.jpg"></p> <p><img src="img/3.jpg"></p> <p><img src="img/3.jpg"></p> <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('p'); var oEvent=ev||event; var pos=getPos(oEvent); for(var i=aDiv.length-1;i>0;i--) { aDiv[i].style.left=aDiv[i-1].offsetLeft+'px'; aDiv[i].style.top=aDiv[i-1].offsetTop+'px'; } aDiv[0].style.left=pos.x+'px'; aDiv[0].style.top=pos.y+'px'; } </script> </body> </html>