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可滚动区域

回答

相关问题