0

私は次の設定をしています:

<asp:treeview cssclass="draggable"><items...>  <table />

そして、jQueryを使用して、ツリービューからテーブルにアイテムをドラッグできるように設定しました。

 $(".draggable").draggable({ helper: "clone", cursorAt: { left: -10, top: -10} }) 

したがって、ドラッグしている間、クローンは現在のマウス位置の少し下に留まり、ユーザーが使いやすくすることを目的としています。

ただし、開いているノードがツリービューをコンテンツの単純なページを超えてプッシュする場合は、ツリービューを(垂直方向に)スクロール可能にする必要があります。そうしないと、ユーザーにとってドラッグアンドドロップが難しくなります。

この点で、次のように、ツリービューの周りにスクロール可能なdivを配置しました。

<div style="padding-right: 20px; overflow: auto; overflow-x: hidden; height: 300px;"> <asp:treeview cssclass="draggable"><items...></div>  <table />

これは期待どおりに機能しますが、問題は、ドラッグ中にクローン要素がマウス位置のすぐ下ではなく、下にあることです。これはもちろん、ユーザーにとって非常に混乱します。

draggable()メソッドの「cursorAt」プロパティを削除しようとしましたが、これは役に立ちません。

したがって、divの固定された高さが、複製された要素の位置を台無しにしているようです...これを修正する方法はありますか?

4

1 に答える 1

1

答えは、CursorAtがデフォルトでドラッグされたアイテムの親になり、この場合はdivに変更されたということです。

したがって、draggable()をに変更します

 $("draggable").draggable({ helper: "clone", appendTo:'body', cursorAt: { left: -10, top: -10} }) 

問題を修正しました。

于 2011-03-11T12:59:28.263 に答える