3

それに関連する用語がわからないため、この動作に関する情報をインターネットで検索するのは非常に困難です。私はそれを説明するために最善を尽くします。

これは、スクロールをサポートするほとんどすべてのブラウザ要素で通常発生する動作です。マウスをクリックし、ボタンを押したままスクロール領域の外側にドラッグすると、終了した方向に向かって水平または垂直に自動的にスクロールします。

ページ要素を選択してコピーしようとする場合は非常に役立ちますが、他のカスタム操作を実行する場合はこの動作を防止する必要があります。私が実装しようとしている機能は、PDFビューアで目立つようにマウスをつかむツールのように、マウスをドラッグしてページをドラッグする機能です。最小限のコードでうまく機能しますが、マウスがスクロール可能な領域を離れたときにこのヘルパーの自動スクロールを無効にする方法がわかりません。

    $("#scroll_area").on('mousedown', function (e) {
        startPos.x = e.clientX;
        startPos.y = e.clientY; 
        drag = true;
    });
    $(document).on('mousemove', function (e) {
        if (drag) {
            // find relative mouse motion
            var diffX = e.clientX - startPos.x;
            var diffY = e.clientY - startPos.y;
            // scroll our body by the relative amount. 
            document.body.scrollTop -= diffY;
            document.body.scrollLeft -= diffX;
            startPos.x = e.clientX;
            startPos.y = e.clientY; // continue updating
            return false; // if dragging do not perform regular things
        }
    });
    $(document).on('mouseup', function (e) {
        // clean up the drag no matter where you let go of the mouse.
        // don't bother evaluating motion here. 
        drag = false;
    });

私の望みは、falseを返すことで問題が解決することでしたが、そうではありません。実際、マウスの移動が停止した場合でも(スクロール領域の外にドラッグされた場合)、自動スクロールは続行されます。

4

1 に答える 1

2

PreventDefaultを試しましたか?

$("#scroll_area").on('mousedown', function (e) {
    e.preventDefault();
});

これにより、ページ上でのすべてのドラッグが防止されます。次に、ドラッグで実行したい機能だけを実装できます。

JSFiddleの例:http ://jsfiddle.net/nwGaF/1/

于 2012-10-17T19:28:56.853 に答える