风-fmgao

导航

迅速运动

<div id="wrap">

    <button id="btn">运动</button>
    <div class="box" id="box1">

    </div>

</div>
*{
    padding: 0;
    margin: 0;
}
.box{
    width: 200px;
    height: 200px;
    background-color: #FF0000;
    position: absolute;
    top: 50px;
    left: 0px;
}
    var btn = document.getElementById('btn');

    var box1 = document.getElementById('box1')

    var count  = 0;
    var time = null;
    btn.onclick = function(){

        time = setInterval(function(){
            count+=10;
            if(count>1000){
                clearInterval(time)
                box1.style.display = 'none'
            }

            box1.style.left = count + 'px'                

        },10)

    }

posted on 2018-07-02 08:46  风-fmgao  阅读(82)  评论(0编辑  收藏  举报