滚动鼠标移动

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

滚动鼠标移动

回答

相关问题