javascript DIV实现跟随鼠标移动

2024-03-22 06:24:03 494

<html> <head> <metahttp-equiv="Content-Type"content="text/html;charset=utf-8"/> <title></title> <scripttype="text/javascript"> window.onload=function(){ vardiv1=document.getElementById('div1'); document.onmousemove=function(ev){ //IE支持event，firefox不支持 varoEvent=ev||event; // varscrollLeft=document.documentElement.scrollLeft||document.body.scrollLeft; varscrollTop=document.documentElement.scrollTop||document.body.scrollTop; div1.style.top=oEvent.clientY+scrollTop+'px';//Y div1.style.left=oEvent.clientX+scrollLeft+'px';//X }; }; </script> </head> <body> <divid="div1"style="width:10px;height:10px;background-color:blue;position:absolute;"></div> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> <br/> </body> </html>

<html> <head> <metahttp-equiv="Content-Type"content="text/html;charset=gb2312"/> <title></title> <styletype="text/css"> div{ width:2px; height:2px; background-color:red; position:absolute; } </style> <scripttype="text/javascript"> window.onload=function(){ varoDivs=document.getElementsByTagName('div'); document.onmousemove=function(ev){ varoEvent=ev||event; document.getElementsByTagName('span')[0].innerHTML=oEvent.clientY+'|'+oEvent.clientX; for(vari=oDivs.length-1;i>0;i--){ oDivs[i].style.top=oDivs[i-1].style.top; oDivs[i].style.left=oDivs[i-1].style.left; } oDivs[0].style.top=oEvent.clientY+'px'; oDivs[0].style.left=oEvent.clientX+'px'; }; }; </script> </head> <body> <span></span> <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> <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> <div></div> <div></div> <div></div> <div></div> <div></div> <div></div> <div></div> </body> </html>

javascript DIV实现跟随鼠标移动

热门推荐

随机推荐