Sliding div not moving smoothly
<p>I have a slider which im trying to slide by using mouse move but it doesn't move naturally it jumps in stages but i do not know why.</p>

<p>I have a jsfiddle here:
<a href="http://jsfiddle.net/97Mnf/3/" rel="nofollow">http://jsfiddle.net/97Mnf/3/</a> you will see the slider doesn't move with the mouse properly.</p>

<p>My code is :</p>

<pre><code>window.onload = function(){
    document.getElementById('cursor').addEventListener("mousedown", mousePos, false);   
}

function mousePos(e){   
    var x = e.pageX;
    document.getElementById('cursor').addEventListener("mousemove", function(e){mousemoveCalc(e,x);}, false);
    document.getElementById('cursor').removeEventListener("mouseup", mousemoveCalc, false); //not working
    document.getElementById('cursor').removeEventListener("mouseout", mousemoveCalc, false); //not working
}   

function mousemoveCalc(e,x){    
    var difx = 0 + parseInt(x + e.pageX);

            if(difx &gt; 270){
                 difx=270;
            }else if(difx&lt;0){
                 difx=0;
            }

    document.getElementById('cursor').style.left = difx+'px';

}
</code></pre>
