가감속운동

1582 단어 DOM의 운동 사례
Document


    function create(_body){
        let _circle=document.createElement("div");
        _body.appendChild(_circle);
    }
    function move(_target){//  
        let _width=document.documentElement.clientWidth||document.body.clientWidth;
        let _timer=window.setInterval(function(){
            _target.style.left=_target.offsetLeft+5+"px";
            if(_target.offsetLeft+_target.offsetWidth>=_width){
                window.clearInterval(_timer);
            }
        },30);
    }
    function move(_target){//   
        let _width=document.documentElement.clientWidth||document.body.clientWidth;
        let _speed=0;
        let _timer=window.setInterval(function(){
            _target.style.left=_target.offsetLeft+(_speed+=0.5)+"px";
            if(_target.offsetLeft+_target.offsetWidth>=_width){
                window.clearInterval(_timer);
            }
        },30);
    }
    function move(_target){//   
        let _width=document.documentElement.clientWidth||document.body.clientWidth;
        let _speed=10;
        let _timer=window.setInterval(function(){
            _target.style.left=_target.offsetLeft+(Math.random()*_speed)+"px";
            if(_target.offsetLeft+_target.offsetWidth>=_width){
                window.clearInterval(_timer);
            }
        },30);
    }
    function main(){
        let _body=document.getElementsByTagName("body")[0];
        create(_body);
        move(_body.children[0]);//    
    }
    window.onload=main;

좋은 웹페이지 즐겨찾기