请问我哪里写错了啊,为什么回不去

来源:4-3 任意属性值(一)

慕标2475242

2016-08-11 21:16

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>多物体动画2</title>

<style type="text/css">

body{margin:0;padding:0;}

ul{list-style:none; }

ul li{width:200px;height:150px;background:#0f0;margin-bottom:20px;border:1px solid #0ff;}

</style>

<script type="text/javascript">

window.onload=function(){

var aLi=document.getElementsByTagName('li');

for (var i =0;i<aLi.length;i++){

aLi[i].timer=null;

aLi[i].onmouseover=function(){

startMove(this,600);

}

        aLi[i].onmouseout=function(){

startMove(this,300);

}

   }

}

    //getStyle

function getStyle(obj,attr){

   if(obj.currentStyle){

 return obj.currentStyle[attr]

}

else{

 return getComputedStyle(obj,false)[attr]

}


}


//var timer=null;

function startMove(obj,iTarget){

clearInterval(obj.timer);

obj.timer=setInterval(function(){

var icur=parseInt(getStyle(obj,'width'));

var speed=(iTarget-icur)/6;

speed=speed>0?Math.ceil(speed):Math.ceil(speed);

if(icur==iTarget){

clearInterval(obj.timer);

}

else{

obj.style["width"]=icur+speed+'px';

}

},30)

}

</script>

</head>

<body>

<ul>

<li></li>

<li></li>

<li></li>

</ul>

</body>

</html>


写回答 关注

1回答

  • 善良阿呆
    2016-08-11 21:42:50
    已采纳

    startMove(this,300);你的css原来样式为200px啊

    慕标2475...

    gan'xie

    2016-08-12 07:39:19

    共 1 条回复 >

JS动画效果

通过本课程JS动画的学习,从简单动画开始,逐步深入各种动画框架封装

113925 学习 · 1443 问题

查看课程

相似问题