1

2つのHTMLdiv要素があります。1つはソース、もう1つは運命です。それぞれの中にはキャンバス要素があります。jQuery UIを使用して、これらのキャンバスの1つをソースdivからデスティニーdivにドラッグアンドドロップできるようにしたいと思います。

問題は、キャンバスがドロップされると、destiny div内の新しい位置が期待どおりにならず、これを修正できなかったことです。

これが私が取り組んでいるコードです：http：//jsfiddle.net/Mf6zJ/1/

これを修正する方法について何かアイデアはありますか？

ありがとう

4

2 に答える 2

2

jquerydroppableは正常に機能しています。dropイベントハンドラーは、キャンバスをに追加できますdestiny。ドラッグ可能はキャンバスにいくつかのスタイルを追加するため、キャンバスはdestinydivの外側にあるように見えます。

ここでは、これをすばやく簡単に解決する1つの方法を紹介します。

$("#destiny").droppable({
    accept: "#source > canvas",
    drop: function(event, ui) {
        ui.draggable.appendTo($(this)).removeAttr('style');
    }
});

これがフィドルです。

于 2012-06-10T12:36:37.870 に答える
0

ドロップ可能なメソッドのコールバック関数を使用して、ドラッグ可能なキャンバスを追加しようとしました。ドロップはすでに発生しているため、これは必要ありませんでした。

例： http: //jsfiddle.net/Mf6zJ/2/

ソース: http://jqueryui.com/demos/droppable/

これで問題が解決することを願っています

于 2012-06-10T12:32:06.290 に答える