Javascript可滾動區域

我希望能夠實現一些JavaScript，以便您可以單擊並拖動整個時間軸類

.timeline { 
    white-space:nowrap; 
    overflow-x: scroll; 
    padding:30px 0 10px 0; 
    position:relative; 
}

這是JavaScript滾動，我試過，但它確實似乎沒有工作。

$('#timeline-wrapper').mousedown(function(e) { 
    down = true; 
    scrollLeft = this.scrollLeft; 
    x = e.clientX; 
}).mouseup(function() { 
    down = false; 
}).mousemove(function(e) { 
    if (down) { 
     this.scrollLeft = scrollLeft + x - e.clientX; 
    } 
}).mouseleave(function() { 
    down = false; 
});

什麼是最好的實現方式？

謝謝。

來源

2014-02-21 faooful

你嘗試過什麼迄今爲止獲得拖動的工作？你卡在哪裏？ –

讓這裏的人來幫助你的最好方法就是向他們展示你首先嚐試過的東西。沒有人願意花時間爲你免費爲你工作。 – Jared

對不起，你是對的，我很抱歉。我發現的解決方案已經在Jquery中，並且在這個特定的項目中，我們試圖使用所有的JavaScript。我用我試過的一個例子編輯了這個問題。 – faooful

您的代碼確實有效。

確保您的選擇器正確。沒有id爲'timeline-wrapper'的元素）。

$('.timeline').mousedown(function(e) { 
...

也應用一些文本選擇防止。像這樣的：https://stackoverflow.com/a/16805743/5483521

body { 
    padding:25px; 
    font-family:sans-serif; 
    -webkit-user-select: none; 
    -khtml-user-select: none; 
    -moz-user-select: none; 
    -o-user-select: none; 
    user-select: none;   
}

工作小提琴： http://jsfiddle.net/zJ6kp/415/

來源

2015-10-24 16:24:37

Javascript可滾動區域

回答

相關問題