請(qǐng)問，這BUG是怎么回事？http://idcbgp.cn/video/3049
<!DOCTYPE?html>
<html>
<head>
<meta?charset="UTF-8">
<title></title>
<style?type="text/css">
*?{
margin:?0;
padding:?0;
}
.lis?{
height:?60px;
width:?260px;
background-color:?antiquewhite;
border-radius:?60px;
margin-top:?10px;
line-height:?60px;
text-align:?center;
border:?5px?solid?cadetblue;
}
</style>
<script?type="text/javascript">
function?getclsname(clsname,?parent)?{
var?oparent?=?parent???document.getElementById(parent)?:?document,
eles?=?[],
elements?=?oparent.getElementsByTagName("*");
for?(var?i?=?0,?l?=?elements.length;?i?<?l;?i++)?{
if?(elements[i].className?==?clsname)?{
eles.push(elements[i]);
}
}
return?eles;
}
window.onload?=?function()?{
var?lis?=?getclsname("lis",?"oul"),
speed?=?10;
for?(var?i?=?0,?l?=?lis.length;?i?<?l;?i++)?{
this.timer=null;
lis[i].onmouseover?=?function()?{
lis_over(this,?speed,?0,?500);
}
lis[i].onmouseleave?=?function()?{
lis_over(this,?speed,?1,?260);
}
}
}
function?lis_over(obj,?speed,?lg,?itg)?{
lis_style=window.getComputedStyle(obj,null),
wd=lis_style.width;
clearInterval(obj.timer);
obj.timer?=?setInterval(function()?{
if?(parseInt(wd)?==?itg)?{
clearInterval(obj.timer);
}?else?{
if?(lg?!=?0)?{
speed?=?-10;
}
obj.style.width?=?parseInt(wd)?+?speed?+?"px";
}
},?50)
document.title=parseInt(wd);
}
</script>
</head>
<body>
<ul?id=oul>
<li?class="lis">imooc</li>
<li?class="lis"></li>
<li?class="lis"></li>
<li?class="lis"></li>
<li?class="lis"></li>
<li?class="lis"></li>
</ul>
</body>
</html>
如上代碼，非常感謝！
2016-07-04
var lis_style=window.getComputedStyle(obj,null),
? ? ?wd=lis_style.width;
定義變量要放在定時(shí)器內(nèi)部。放在外部的話，第一次傳入定時(shí)器內(nèi)的wd值為260，再一次執(zhí)行定時(shí)器不會(huì)重新上訴代碼，因此wd的值始終為260，所以效果顯示出來(lái)就是停在了寬度為270的地方。