ZXJ03
2016-10-20 18:55
<!DOCTYPE html> <html> <head> <title></title> <style type="text/css"> #div1{ background: red; width: 100px; height:100px; border:2px solid gray; } </style> <script type="text/javascript"> window.onload=function(){ var oDiv=document.getElementById("div1"); oDiv.onmouseover=function(){ startMove(0); } } function startMove(iTarget){ var timer; clearInterval(timer); var oDiv=document.getElementById("div1"); timer=setInterval(function(){ oDiv.style.width=parseInt(getStyle(oDiv,width))-1+'px'; },50); } function getStyle(obj,attr){ if(obj.currentStyle){ return obj.currentStyle[attr]; } else{ return getComputedStyle(obj,false)[attr]; } } </script> </head> <body> <div id="div1"></div> </body> </html>
为什么会显示
width is not defined
不好意思,又试了一下,object.style.width这样才是对的,也不知道刚是怎么回事。只需要在26行的width加上'’就行了
js里object.style.attr这种不需要"",而且不加""一般都是变量
百度之后发现width这个属性js里面只能object.width这样用,还有26行的width应该加''
JS动画效果
113925 学习 · 1443 问题
相似问题