2

ドラッグ可能/ドロップ可能な小さなjqueryアプリがあり、クローンがドロップされた後、ドラッグ可能なアイテムを保持して元の位置に保持するのに問題があります。

誰でも手伝ってもらえますか?

http://jsfiddle.net/franco13/vLSZf/1/

ありがとうございました。

$(init);

function init() {

    $('.teamEmblem').draggable({
        //    containment: $('.teamEmblem').parent(), // this does not work
        cursor: 'move',
        helper: 'clone',
        obstacle: ".teamEmblem", // this does not work
        preventCollision: true, // this does not work
        revert: true
    });

    $('.winner').droppable({
        hoverClass: 'hovered',
        tolerance: 'touch',
        drop: handleCardDrop1
    });

}

function handleCardDrop1(event, ui) {

    if (true) {
        ui.draggable.addClass('correct');
        ui.draggable.draggable('disable');
        $(this).droppable('disable');
        ui.draggable.position({
            of: $(this),
            my: 'left top',
            at: 'left top'
        });
        ui.draggable.draggable('option', 'revert', false);
    }

}
4

1 に答える 1

4

ドラッグ可能な要素を複製し、複製された要素に少しスタイルを適用できます。

デモを見る

function handleCardDrop1(event, ui) {
    if (true) {

        ui.draggable.addClass('correct');
        ui.draggable.draggable('disable');
        $(this).droppable('disable');

        var dragged = ui.draggable.clone(true);
        dragged.position({
            of: $(this),
            my: 'left top',
            at: 'left top'
        }).css({
            position: 'absolute',
            display: 'block',
            margin: '0 auto'
        });
        ui.draggable.draggable('option', 'revert', false);
        $('body').append(dragged);
    }

}
于 2013-04-28T11:27:17.540 に答える