Как сделать div, перетаскиваемый друг в друга в html?

Question

<div class="player-tab"> 
    <div class="img-wrap" draggable="true"> 
     <img src="assets/player.png" alt=""> 
    </div> 
    <div class="img-wrap" draggable="true"> 
     <img src="assets/player.png" alt=""> 
    </div> 
    <div class="add-recording"> <a href="#">+ Add Recording</a> 

    </div> 
</div> 

В этом коде можно добавить запись, а изображение игрока показать после добавления. Я хочу, чтобы img-wrap перетаскивал друг друга.

Я имею в виду, что я загружаю 1 запись и 2 записи. Я могу сортировать его до второго первого и первого позже. Таким образом, он может сортироваться в формате по мере необходимости пользователя. Кто-то знает какую-либо хорошую идею для реализации этой функции.

Answer 1

Вы можете использовать JQuery:

$(function() { 
    $("#divid").draggable(); 
    }); 

увидеть это: http://jqueryui.com/draggable/

Я думаю, что вы хотите, это:

$(function() { 
$("#sortable").sortable(); 
$("#sortable").disableSelection(); 
}); 

чек здесь: http://jqueryui.com/sortable/