2

特定のテキストをクリックすると、div-pop-upが表示されます。移動可能にしたいので、jQuery UIdraggable()機能を使用して、チャームのように機能します。ただし、私が抱えている問題は、このポップアップ内のdivにあります。必要に応じて、0からほぼ無限大までの範囲の配列からの情報を表示しています。したがって、私はoverflow:autoそれをスクロールボックスにするために使用しています。すべてが正常に表示されますが、上下の矢印をクリックしてそのボックス内を上下にスクロールすると、代わりにドラッグ可能な機能が開始されます。それはかなり迷惑であり、問​​題が発生している理由を理解しています。私はそれを修正するか、何らかの方法でそれを回避するためのアドバイスを探しています。

問題を表示するためのjsfiddleは次のとおりです。http://jsfiddle.net/BnTPG/

4

2 に答える 2

0

ハンドルオプションを使用できます。見てください(私はあなたのフィドルを修正しました)。私の例では、タイトルをドラッグ可能なハンドルとして設定し、クラスの代わりにいくつかのIDを使用しました。

http://jsfiddle.net/BnTPG/2/

相対的および絶対的なポジショニングを使用しているため、この問題が発生していると思います(これは単なる推測であり、私はこれをテストしていません)。

于 2012-07-18T03:46:10.163 に答える
0

私の側では、すべてのポップアップを必要な場所にドラッグすることを本当に好みます。

問題を解決したい場合は、スクロールするdivをラップするDIVを追加する必要があります。Firefoxでは、スクロールバーはドラッグ可能な親divにリンクされており、スクロール可能な子供だけではないと思います。

                $('body').on("mousedown", ".draggable", function(e) {

                    // Impossible to drag these LIEN, INPUT, TEXTAREA, SELECT
                    var clicked = $(e.target).get(0).tagName;
                    if (clicked == 'A' || clicked == 'INPUT' || clicked == 'TEXTAREA' || clicked == 'SELECT') {
                            return true;
                    }
                    if ($(e.target).parents().hasClass('selectable')) {
                            return true;
                    }

                    // Stop clic action
                    if (e && e.preventDefault) {
                            e.preventDefault();
                    } else {
                            window.event.returnValue = false;
                    }

                    ... etc ...


<div id="debuger" class="draggable" style="overflow: hidden;">
     <div class="selectable">
          <div id="text"> Scrollable text </div>
</div></div>
于 2013-09-11T15:34:54.613 に答える