javascript - jQuery 抓取内容并水平滚动页面

Question

我的目标是在鼠标移动时抓取内容 x 并水平滚动页面，直到鼠标停止（mouseup 事件），类似于平板电脑的滑动动作。

看起来很简单.. 在 mousedown 上获取 clientX，在移动时通过 ClientX 滚动，完成后关闭 mousemove 功能。

我已经玩了一段时间了，无法获得我正在寻找的滚动效果..

我在这里做错了什么？

$('#thediv').on('mousedown', function(event) {  
    var e = event;   

    $('#thediv').on('mousemove',function(event){ 
        new_e = event; 
        $('html, body').stop().animate({
            scrollLeft: new_e.clientX  
        }, 300);   
        return false;  
     }); 

    $('#thediv').on('mouseup', function() { 
        $('#thediv').off('mousemove');  
    }); 
}); 

http://jsfiddle.net/mD7mu/

Answer 1

$('#greendiv').on('mousedown', function(e) {
    $('#greendiv').on('mousemove', function(evt) {
        $('html,body').stop(false, true).animate({
            scrollLeft: e.pageX - evt.clientX
        });
    });
});

真的很近。我认为，只需从 pageX 中减去 clientX ，然后false,true在 stop 函数中使用就会给你想要的效果。

这是小提琴！