标签:style blog http io ar color os 使用 sp
//---------使用onmousedown/onmouseup/onmousemove事件分别给以不同的行为完成“当鼠标按下时移动有尾巴,抬起消失”的兼容性功能
//--尚未解决的问题------只是一种伪消失,并不是真正的取消onmousemove的行为,应当使用onmousemove=null;来解决,但是出现问题了
1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 2 <html xmlns="http://www.w3.org/1999/xhtml"> 3 <head> 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 5 <title>mouseTail</title> 6 </head> 7 <style type="text/css"> 8 div{width: 10px;height: 10px;position: absolute;background: red;display: none;cursor: pointer;} 9 </style> 10 <script type="text/javascript"> 11 window.onload=function(){ 12 var i=0; 13 oDiv=document.getElementsByTagName(‘div‘); 14 var oEvent; 15 for(i=0;i<5;i++){ 16 document.body.innerHTML+=document.body.innerHTML; 17 } 18 19 function mouseTail(ev){ 20 oEvent=ev||event; 21 for(i=0;i<oDiv.length-1;i++){ 22 oDiv[i].style.left=oDiv[i+1].offsetLeft+‘px‘; 23 oDiv[i].style.top=oDiv[i+1].offsetTop+‘px‘; 24 } 25 oDiv[oDiv.length-1].style.left=oEvent.clientX+‘px‘; 26 oDiv[oDiv.length-1].style.top=oEvent.clientY+‘px‘; 27 } 28 29 document.onmousedown=function(ev){ 30 oEvent=ev||event; 31 for(i=0;i<oDiv.length;i++){ 32 oDiv[i].style.left=oEvent.clientX+‘px‘; 33 oDiv[i].style.top=oEvent.clientY+‘px‘; 34 oDiv[i].style.display=‘block‘; 35 } 36 document.onmousemove=mouseTail; 37 } 38 document.onmouseup=function(){ 39 40 for(i=0;i<oDiv.length;i++) oDiv[i].style.display=‘none‘; 41 } 42 } 43 </script> 44 <body> 45 <div></div> 46 </body> 47 </html>
标签:style blog http io ar color os 使用 sp
原文地址:http://www.cnblogs.com/fleshy/p/4124863.html