3

私の目標は、タブレットのスワイプアクションと同様に、コンテンツxを取得し、マウスが停止するまでマウスが移動している間にページを水平方向にスクロールすることです（マウスアップイベント）。

簡単そうです。mousedownでclientXを取得し、移動中にClientXでscrollLeftを実行し、完了したら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/

4

1 に答える 1

4 
$('#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関数で使用すると目的の効果が得られると思います。

これがフィドルです！

于 2012-12-18T05:24:36.980 に答える