问答详情
源自：4-1 JS多物体动画

请问大佬哪儿错了啊？？？

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>多物体运动</title>

    <style type="text/css">

        *{
            padding:0;
            margin:0;

        }

        ul,li{
            list-style: none;
        }

        ul li{
            width:200px;
            height:100px;
            background-color: chartreuse;
            margin-bottom:20px;
        }

    </style>
</head>
<body>
    <ul>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
    </ul>

<script>
    window.onload = function(){
        var aLi=document.getElementsByName('li');
        for(i=0;i<aLi.length;i++){
            aLi[i].onmouseover= function(){
                    starMove(this,400);
            }
            aLi[i].onmouseout= function(){
                starMove(this,200);
            }
        }
        var timer = null;
        function starMove(obj,target){
            clearInterval(obj.timer);
            timer = setInterval(function(){
                var speed=(target-obj.offsetWidth)/8;
                speed=speed>0?Math.ceil(speed):Math.floor(speed);
                if(obj.offsetWidth== target){
                    clearInterval(timer);
                }else{
                    obj.style.width=obj.offsetWidth+speed+'px';
                }
            },30)
        }
    }

</script>

</body>
</html>

?

提问者：qq_慕仙5504668 2019-08-23 17:06

个回答

  • 爱前端的小鑫
    2020-05-05 21:35:28

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

    这句打错了

    0
  • qq_流星泪_5
    2019-08-23 20:30:08

    for循环里未定义aLi[i].timer=null，在starMove方法中就直接使用


    0