Перетащите изображения из одного div в другой div

Question

Я хотел бы перетащить некоторые изображения из div в другой div... у меня есть контейнер div, у которого есть еще 5 div, в этих 5 divs есть несколько png. Что мне нужно, это перетащить 1 по одному эти png из 1-го div в div с id="dropspot", затем нажать на кнопку "next button", чтобы перейти ко второму div, который находится в контейнере, и очистить div из dropspot, и так далее до тех пор, пока 5 див.

Я пробовал что-то, но не то, что мне нужно:(эта функция делает все изображения перетаскиваемыми, и мне нужно только изображения внутри контейнера, чтобы перетаскивать.

Вот скрипка: http://jsfiddle.net/ygaw2/7/

и немного кода:

$(function() {
    $( "#container img" ).draggable();
    ({
    containment: "#container",    
    revert: "invalid",
    helper: "clone"

    });
    $( "#dropspot" ).droppable({

      tolerance: 'fit',

      drop: function( event, ui ) {


      }
    });
  });

Answer 1

Попробуйте это решение: http://jqueryui.com/droppable/ Мне кажется, что вы хотите, чтобы это работало.

В обратном вызове вы можете очистить содержимое сбрасываемого элемента.

РЕДАКТИРОВАТЬ

В этом примере все, что вам нужно, связано с одной вещью:

$( "#container img" ).draggable({
    containment: "#container",    
    revert: "invalid",
    helper: "clone"

    });

Удалять (); после перетаскивания