求大神解答。。。实在不知道错哪里了。。哭了

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

hhhs1s1s

2016-04-16 00:13

 <!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>Document</title>

<style type="text/css">

*{margin:0;padding: 0}

ul li{width: 200px;height: 100px;background-color: red;margin-bottom: 10px;border: 4px solid #000}

ul li{list-style: none;}

</style>

</head>

<body>

<ul>

<li></li>

<li></li>

<li></li>

</ul>

</body>

<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(){

moveto(this,400);//让宽到300

}

aLi[i].onmouseout=function(){

moveto(this,200);

}

}

}


function getStyle(obj,style){

  if(obj.currentStyle){

    return obj.currentStyle[style];

    }

  else{

    return getComputedStyle(obj,false)[style];

    }

}

function moveto(obj,itarget){

clearInterval(obj.timer);

obj.timer=setInterval(function(){

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

var speed=(itarget-icur)/8;

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

if(icur==itarget){

clearInterval(obj.timer);

}

else{

obj.style.width=icur+speed+'px'

//console.log(icur+' ,'+speed+' ,'+obj.style.width);

}

},30)

}


</script>

</html>


写回答 关注

4回答

  • hhhs1s1s
    2016-04-20 15:00:33

    没有问题,我自己的问题。。。浏览器缩放了。。谢谢大家了。。不知道谁动我电脑了

  • qq_精慕门0238851
    2016-04-20 14:41:22

    有一句没有加分号obj.style.width=icur+speed+'px',只是看了一下,没有运行

  • csusun
    2016-04-19 19:57:06

    哪里有问题?没看出来啊

  • 慕村5414681
    2016-04-16 15:17:35

    出现了什么问题???

JS动画效果

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

113925 学习 · 1443 问题

查看课程

相似问题