最新回答 / MarvelYao
clearInterval(timer)，應(yīng)該是obj.timer調(diào)試看看動畫過程是否正確取值和設(shè)置值flag在里面的時候，外面的判斷取不到flag的值，obj.timer關(guān)不掉。效果看起來當(dāng)然一樣，跟第一問差不多。
2017-11-17
function startMove(obj,goal){
clearInterval(obj.timer);
obj.timer=setInterval(function(){
var speed=(goal-obj.offsetWidth)/8
speed=speed>0?Math.ceil(speed):Math.floor(speed);
if (goal==obj.offsetWidth) {
clearInterval(obj.timer);}
else{obj.style.width=obj.offsetWidth+speed+'px';}
},30)}
clearInterval(obj.timer);
obj.timer=setInterval(function(){
var speed=(goal-obj.offsetWidth)/8
speed=speed>0?Math.ceil(speed):Math.floor(speed);
if (goal==obj.offsetWidth) {
clearInterval(obj.timer);}
else{obj.style.width=obj.offsetWidth+speed+'px';}
},30)}
2017-11-13
window.onload=function(){
var Oli=document.getElementsByTagName("li");
for (var i = 0; i < Oli.length; i++) {
Oli[i].timer=null;
Oli[i].onmouseover=function(){
startMove(this,400);
}
Oli[i].onmouseout=function(){
startMove(this,200);
}
}
}
var Oli=document.getElementsByTagName("li");
for (var i = 0; i < Oli.length; i++) {
Oli[i].timer=null;
Oli[i].onmouseover=function(){
startMove(this,400);
}
Oli[i].onmouseout=function(){
startMove(this,200);
}
}
}
2017-11-13
<style type="text/css">
*{ margin: 0; padding: 0; list-style: none; }
ul li{ background: #7abcf2; width: 200px; height: 80px; margin: 15px; }
</style>
<ul>
<li></li>
<li></li>
<li></li>
</ul>
*{ margin: 0; padding: 0; list-style: none; }
ul li{ background: #7abcf2; width: 200px; height: 80px; margin: 15px; }
</style>
<ul>
<li></li>
<li></li>
<li></li>
</ul>
2017-11-13
