Animating images with DHTML

1

Hey, guys. What I’m trying to do is get the arrow to move to the position of the link and stop. Right now I only have it working for “Bottom”, but when I click on Bottom a second time the arrow keeps going. My guess is that my script is not getting the original position of the DIV in which arrow resides. Shouldn’t it not continue since I used the clearTimeout function? Here’s my code:

<script type="text/javascript">
    
    var i = 1
    function moveToBottom() {
    
        var position = document.getElementById('pointer').style.top =+ i + "px"
        counter = setTimeout("moveToBottom()",10)
        i++
        if (position == 200 + "px") {
        
            clearTimeout(counter)
        }
    }
    
</script>

and here’s the example: http://www.digitalmatt.net/DHTML/week2/elevator1.html