滾動鼠標移動

var down=false; 
var scrollLeft=0; 
var x=0; 

$('#test').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; 
});

這裏有一個演示：http://jsfiddle.net/STVqe/3/滾動鼠標移動

我希望能夠通過使用鼠標滾動股利。它可以正常工作，雖然由於您可能會意外地選擇了某些內容而顯得有些不可思議，但是當您將鼠標移動到測試div以外時出現問題。即使我設置了down=false，它也會繼續滾動。我該如何阻止這種情況，爲什麼會發生？

來源

2011-06-06 Radu

你說的意思是「通過使用鼠標滾動股利？」當我移動鼠標時，實際上我看不到任何不同的事情發生，無論它是否被點擊。 – 2011-06-06 18:35:02

單擊div並按住鼠標，然後水平移動它。 – Radu 2011-06-06 18:37:11

這裏也許是預期的效果更清晰的例子：http://jqueryfordesigners.com/demo/scrollable-timelines.html – Radu 2011-06-06 18:38:52

這個工作對我來說在Chrome：http://jsfiddle.net/mattball/MP2cg/

來源

2011-06-06 18:50:11

這適用於我在Firefox 4 – BrunoLM 2011-06-06 18:51:48

同樣的事情尼爾建議，它的工作原理，但我想保持滾動條，如果可能的話。 Neal建議只使用div來完成與滾動條相同的操作，但避免這種情況會很好。 – Radu 2011-06-06 18:52:26

隱藏滾動條解決了它。然而，一個滾動條*會在這裏很好......（要有一個指示符，其中隱藏的文字是） – 2011-06-06 18:53:07

它看起來像這個問題實際上是因爲被選中的文本引起的。如果你添加了不可選擇的文本CSS規則，並且使用原始的JavaScript，它可以根據需要使用滾動條（我相信）。經測試，在FF 3.6

來源

2011-06-06 19:25:22 James

+1證實FF工作，但在Chrome 11 – Radu 2011-06-06 19:32:43

點擊和拖動的元素的左側或右側在Chrome做一些奇怪的，即使沒有任何文字的東西滾動左，右也不行。這似乎是Chrome的默認行爲...也許它可以被禁用，或者它可能與您的實際項目無關（只是textareas？） – James 2011-06-06 19:45:43

是的，Chrome似乎是這裏的罪魁禍首。即使在Chrome中，滾動停止在div外的mouseup上，但如果我嘗試在mousele上觸發mouseup，則不會發生任何更改。 – Radu 2011-06-06 20:00:06

滾動鼠標移動

回答

相關問題