並べ替え可能なリストを使用するウィジェットに取り組んでいますが、コンテナーがスクロールしているときに発生するこの小さな問題で立ち往生しています。<li>
が の外に出たくないので、リストに sortable を適用する際<ul>
に設定しています。containment: "parent"
コンテナーがスクロールしていない場合、コンテインメントは正常に機能します。しかし、その場合、アイテムが表示されていないリストの端にドラッグされると、格納は期待どおりに機能しなくなり、アイテムはそれを超えて移動します。
ソート可能な API の何かが欠けているのか、それとも単に jquery-ui のバグなのかはわかりません。これらは私が設定したオプションです:
$(".sortable").sortable({
axis: "y",
containment: "parent",
cursor: "move",
items: "li",
tolerance: "pointer",
});
コンテナの CSS は次のとおりです。
.list-holder {
max-height: 250px;
overflow-y: auto;
overflow-x: hidden;
}
このjsFiddleは、スクロールがある場合とない場合の両方を示しています。