Div滑塊不能正確移動，鼠標移動

Question

我有一個用Javascript製作的滑塊，但移動並不正確，似乎加速而不是保持與鼠標相同的速度。

我知道它是一個邏輯錯誤，但我無法弄清楚我做錯了什麼，所以我希望有人能夠發現錯誤。

與股利交易的功能是這樣的：

var calc = function (e) { 
    var dif = e.pageX - clickX; 
    var parentWidth = parseInt(window.getComputedStyle(el.parentNode).width); 
    var childWidth = parseInt(window.getComputedStyle(el).width); 
    var childLeft = parseInt(window.getComputedStyle(el).left); 
    var left = childLeft + dif; 

    if (left < 0) { left = 0; } 
    else if (left > (parentWidth-childWidth)) { left = (parentWidth-childWidth); } 

    el.style.left = left + 'px'; 
}; 

我提供了一個的jsfiddle以及它在使用中：JSFiddle

Answer 1

非常整潔部件/實施。我更新了fiddle以正常工作。

新增

var dif = e.pageX - clickX; 
    clickX = e.pageX;// update clickX so next time you calculate the right dif 

，否則它是計算從一開始的差別從它最後一次計算得到的差值反對。