2つの画像を結合してドラッグする

Question

2つの画像を同時にドラッグするためのスクリプトを探しています。私は現在、サムネイル画像をコレクションビンにドラッグして後で保存できるスクリプトを用意しています。しかし、私のサムネイルの中には、これらのサムネイル画像を「未知の」植物として表現するために、その上に配置された画像があります。私は、誰かが正しい方向に私を向けることができるかどうか、私はどのようにこれらの2つの画像を引っ張って結びつけるかについて、私は疑問に思っていました。ここに私のコードです：

$(document).ready(function() { 
var limit = 16; 
var counter = 0; 
$("#mainBin1, #mainBin2, #mainBin3, #mainBin4, #mainBin5, #bin_One_Hd, #bin_Two_Hd, #bin_Three_Hd, #bin_Four_Hd, #bin_Five_Hd").droppable({ 
    accept: ".selector, .plant_Unknown", 
    drop: function(event, ui) { 
       counter++; 
     if (counter == limit) { 
      $(this).droppable("disable"); 

     } 


      $(this).append($(ui.draggable).clone()); 


      $("#cbOptions").show(); 
      $(".item").draggable({ 
        containment: "parent", 
        grid: [72,72], 
      }); 
    } 
}); 
$(".selector").draggable({ 
    helper: "clone", 
    revert: "invalid", 
    revertDuration: 700, 
    opacity: 0.75, 
}); 

$(".plant_Unknown").draggable({ 
    helper: "clone", 
    revert: "invalid", 
    revertDuration: 700, 
    opacity: 0.75, 
}); 

}）;

ご協力いただければ幸いです。ありがとう。

EDIT：Website

Answer 1

現在のドラッグ可能な要素を、以前のドラッグ可能な要素の代わりにドラッグ可能なコンテナで囲むことができます。

$(".container").draggable({ 
    helper: "clone", 
    revert: "invalid", 
    revertDuration: 700, 
    opacity: 0.75, 
}); 

PS：

<div class=".container"> 
    <div class=".selector">...</div> 
    <div class=".plant_Unknown">...</div> 
</div> 

そして、とあなたのドラッグ可能な呼び出しを置き換えるのウェブサイトを見た後、あなたはまた、提案した容器としてあなたのリンクタグを考慮することができます。

Answer 2

オブジェクト（関数や変数）を作成することができるかもしれない両方の要素を含んでいる、オブジェクトをドラッグ。