1

次のドラッグ可能なリスト項目構造があります。

<ul id="dadCol_0" class="dad-list ui-sortable">
<li class="dad-item ui-draggable" id="sl1" style="position: relative;">1</li>
<li class="dad-item ui-draggable" id="sl2" style="position: relative;">2</li>
<li class="dad-item ui-draggable" id="sl3" style="position: relative;">3</li>
<li class="dad-item ui-draggable" id="sl4" style="position: relative;">4</li>
<li class="dad-item ui-draggable" id="sl5" style="position: relative;">5</li>
</ul>

長方形の内側をクリックしてドラッグを開始しても問題ありませんが、この長方形の中心にしたいです(幅/ 2、高さ/ 2)。clickAt私が推測するプロパティを使用する必要がありますが、これまでに行ったことの小さな例を次に示します。

$('.dad-item').each(function() {
    $(this).draggable({
        opacity: 0.6, 
    });
});

これにより不透明度が調整されますが、ドラッグは現在壊れています。アイテムは順序を変更せず、トリガーを元に戻すこともありません。

編集:2回目の試行:

dad_list.sortable({
    connectWith: 'ul.dad-list',
    containment: '#containment',
    items: 'li.dad-item',
    cursorAt: {
        top: $(this).height()
    },
    stop: function(event, ui) {
        serializedads();
    }       
});

そして今、私はそれを上下に動かすことができず、水平にしか動かすことができません

4

1 に答える 1

0

このようなものが必要だと思います

$('.dad-item').draggable({
    opacity: 0.6,
    cursorAt: {
        left: width / 2,
        top: height / 2
    }
});
于 2013-01-21T09:35:26.637 に答える