3

私はここに私の問題を示すJSfiddleを持っています。 http://jsfiddle.net/J6uM5/4/

<div id="list-A" style="height:50px; overflow-y:scroll; border:1px solid red">
<ul class="sortable">
    <li>item 1</li>
    <li>item 2</li>
    <li>item 3</li>
    <li>item 4</li>
    <li>item 5</li>
    <li>item 6</li>
    <li>item 7</li>
    <li>item 8</li>
    <li>item 9</li>
    <li>item 10</li>
    <li>item 11</li>
    <li>item 12</li>
    <li>item 13</li>
    <li>item 14</li>
    <li>item 15</li>
    <li>item 16</li>
</ul>


<div id="list-B">
<ul class="sortable">
    <li>item 4</li>
    <li>item 5</li>
    <li>item 6</li>
</ul>

そしてここにJSがあります

$(function() {
$('.sortable').sortable({

    connectWith: ".sortable",
    scroll:false,

}).disableSelection();

});

問題は、sortable1(divによって隠されていますが)がまだdomのsortable2に拡張されていることです。アイテムをlist1からlist2に正常にドラッグするには、list1の一番下までスクロールするか、list1がlist2と重ならないように十分に下にスクロールする必要があります。任意の回避策をいただければ幸いです。

4

1 に答える 1

2

ラッパーの代わりに実際のソート可能なリスト (ul) に高さ/オーバーフローを設定すると、うまくいくようです。

#sortable1 {
    height:25px;
    overflow-y:scroll;
    padding-bottom:35px;
}

ここを参照してください:

http://jsfiddle.net/J6uM5/8/

それはあなたが探していたものですか?

于 2012-11-01T02:38:42.860 に答える