1
私はドラッグの作業を行っています&ドロップドロップ可能な領域にオブジェクトをドラッグすると、ネガティブな位置としてネガ領域に移動した動きがオブジェクトに与えられます。負の位置を適用するドラッグ&ドロップ
これを説明する目的で、私はこの問題を説明するために提供された風景にかわいい犬を落とすことができるJSFiddleをまとめました。私は、変数のエラーを封じ込めに属するように見えるその多くがこの問題を修正する方法についての彼女に読んでの良い取引を行ってきた
//DRAG & DROP
$(document).ready(
function() {
var a = 3;
$('.drag').draggable({
revert: 'invalid',
cursor: 'move',
//containment: '#drop',
start: function(event,ui) { $(this).css("z-index", a++)}
});
$('#drop').droppable({
accept: ".drag",
drop: function(event, ui) {
console.log(this);
//$(this).addClass('dropped'),
$(this).append(ui.draggable);
}
});
});
、残念ながら私はそれらを実装する全くの幸運を持っていたしました:コードは、以下の使用しますここに私自身の設定に修正されます。注意すべき点は、HTML2CANVASを使用してこの#dropエリアのショットをエクスポートするので、移動したアイテムが物理的にスペースにあることを確認する必要があることです。任意の提案をいただければ幸いです。
ありがとうございます!
は[これ](https://jsfiddle.net/arj_dev/f7fzwpkL/1/)です。 – ArJ
犬が目に見えるという意味で、はい。その結果の問題は、犬が元のスペースコードに賢明に留まり、#dropスペースに挿入されていないことです。物理的にドロップスペースに入ることなく、私が言及したHTML2CANVASはイメージをキャプチャしません。 – Cutter
キャンバスにドロップした後にキャンバスに描画したい場合は、キャンバス上でマウスの座標を検出し、キャンバス上のその位置にある** drop **イベントハンドラからイメージを描画することができます。これがあなたが望むものなら、私はフィドルを試すことができます。 – ArJ