Timers and Animation

by Susan Delgado

HTML

<div id="box"></div>

CSS

#box{
    background-color:blue;
    width:100px;
    height:100px;
    position:absolute;
    top: 50;
}

JavaScript

(function (){
    var speed = 10,
        move = function(moveBy){
            var el = document.getElementById("box"),
                left = el.offsetLeft;
              
            if((moveBy > 0 && left > 399) || (moveBy < 0 && left < 51)){
                 clearInterval(timer); 
                timer = setInterval(function(){
                    move(moveBy * -1);
                }, speed);
            }
                        
            el.style.left = left + moveBy + "px";
        }
    //delay
   // setTimeout(anim, speed);
    //animate
    var timer = setInterval(function(){
                    move(3);
                }, speed);
}());