有关编程的问题//为什么运动不了

<!DOCTYPE html>

<html>

<head>

    <meta charset="UTF-8">

    <title>JS动画效果1</title>

    <script src = "script.js"></script>

    <style>

        *{  margin : 0;

            padding: 0;

        }

        .head{

            width: 500px;

            height: 300px;

            padding-top: 100px;

        }

        .head #first{

            width: 400px;

            height: 300px;

            background: red;

            float: left;

        }

        .head #second{

            width:100px;

            height: 100px;

            background:blue;

            float: left;


        }

    </style>

</head>

<body>

<div id = "head">

    <span id = "first">first</span>

    <span id = "second">second</span>

</div>


</body>

</html>



这是JS代码


var timer = null;


window.onload = function(){

    var first = document.getElementById("first");

    first.onclick = active;

}

function active(){

    var first  = document.getElementById("first");

    timer = setInterval(function(){

        first.style.left = first.offsetLeft + 10 + 'px';

    }, 30);

}


皓韵儿
浏览 1285回答 2
2回答

慕粉3557130

试试将float的值改为right
打开App,查看更多内容
随时随地看视频慕课网APP

相关分类

JavaScript