![](https://images.cnblogs.com/OutliningIndicators/ContractedBlock.gif)
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <title></title> 6 <style> 7 div{width: 10px; height: 10px;background-color:red;position: absolute;} 8 </style> 9 <script> 10 function getPosition(ev){ 11 var scrollTop=document.documentElement.scrollTop||document.body.scrollTop; 12 var scrollLeft=document.documentElement.scrollLeft||document.body.scrollLeft; 13 14 return {x:ev.clientX+scrollLeft,y:ev.clientY+scrollTop}; 15 } 16 document.onmousemove=function(ev){ 17 var oEvent=ev||event; 18 var aDiv=document.getElementsByTagName('div'); 19 var position=getPosition(oEvent); 20 21 for(var i=aDiv.length-1;i>0;i--){ 22 aDiv[i].style.left=aDiv[i-1].offsetLeft+'px'; 23 aDiv[i].style.top=aDiv[i-1].offsetTop+'px'; 24 } 25 26 aDiv[0].style.left=position.x+'px'; 27 aDiv[0].style.top=position.y+'px'; 28 } 29 </script> 30 </head> 31 <body> 32 <div> 33 </div> 34 <div> 35 </div> 36 <div> 37 </div> 38 <div> 39 </div> 40 <div> 41 </div> 42 <div> 43 </div> 44 <div> 45 </div> 46 <div> 47 </div> 48 <div> 49 </div> 50 <div> 51 </div> 52 <div> 53 </div> 54 <div> 55 </div> 56 <div> 57 </div> 58 <div> 59 </div> 60 <div> 61 </div> 62 <div> 63 </div> 64 <div> 65 </div> 66 <div> 67 </div> 68 <div> 69 </div> 70 <div> 71 </div> 72 <div> 73 </div> 74 <div> 75 </div> 76 <div> 77 </div> 78 <div> 79 </div> 80 <div> 81 </div> 82 <div> 83 </div> 84 <div> 85 </div> 86 <div> 87 </div> 88 <div> 89 </div> 90 <div> 91 </div> 92 <div> 93 </div> 94 <div> 95 </div> 96 <div> 97 </div> 98 </body> 99 </html>