js 去掉offset等的運動框架 任意運動框架
阿新 • • 發佈：2017-05-14
type onload ets span star tel wid etc ack
<!doctype html> <html> <head> <meta charset="utf-8"> <title>無標題文檔</title> <style> div{ width:200px; height:200px; background:red; margin:10px; float:left; border:1px #000000 double; } </style> <script> window.onload=function(){ var oDiv1=document.getElementById(‘div1‘); oDiv1.onmousemove=function(){ onStart(this,400,‘width‘); } oDiv1.onmouseout=function(){ onStart(this,200,‘width‘); } var oDiv2=document.getElementById(‘div2‘); oDiv2.onmousemove=function(){ onStart(this,400,‘height‘); } oDiv2.onmouseout=function(){ onStart(this,200,‘height‘); } } //var alpha=30; function onStart(obj,tag,value){ clearInterval(obj.timer); obj.timer=setInterval(function(){ var cur=parseInt(getStyle(obj,value));var speed=(tag-cur)/6; speed=speed>0?Math.ceil(speed):Math.floor(speed); if(tag==cur){ clearInterval(obj.timer); }else{ obj.style[value]=cur+speed+‘px‘; } },30); } function getStyle(obj,name){ if(obj.currentStyle){ return obj.currentStyle[name]; }else{ return getComputedStyle(obj,false)[name]; } } </script> </head> <body> <div id="div1">變寬</div> <div id="div2">變高</div> </body> </html>
js 去掉offset等的運動框架 任意運動框架