Мне удалось создать страницу, на которой три перетаскиваемых изображения, содержащиеся в отдельных элементах div, появляются случайным образом из каталога и в произвольных позициях.
Проблема в том, что одно изображение всегда будет скрывать другое при перетаскивании. Можно ли сделать так, чтобы при использовании взаимодействия с перетаскиванием это изображение «переупорядочивалось» вверх, чтобы пользователь мог контролировать порядок расположения?
<!DOCTYPE html>
<html lang="en">
<script type="text/javascript" charset="utf-8" src="js/jquery-1.9.1.js"></script>
<body>
<center>
<!-- image displays here -->
<img src="_" class="draggable ui-draggable" />
<img src="_" class="draggable ui-draggable" /></div>
<script type="text/javascript">
$(function(){
$('.draggable').draggable({ scroll: true, cursor: "move"});
});
$('img').hide().one("load",function(){
$(this).fadeIn(2000);
}).each(function(){
if(this.complete) $(this).trigger("load");
});
</script>
</body>
</html>```