append draggable to container jquery

Question

Я столкнулся с небольшой проблемой при каждом выборе изображения из моей галереи. Изображение отображается в контейнере. Я могу изменить размер и перетащить изображение в контейнере. Моя проблема в том, что изображение скрывается, когда я перетаскиваю изображение за контейнером, что я хочу, так это то, что изображение останавливается прямо на контейнере, и я не хочу его скрывать. как это сделать? вот то, что я есть я не имею рабочий перетаскиваемым обусловленно, что потребует много кодирования им просто собирается разместить скрипт и некоторые CSS и HTML

$('img').on('click', function() { 
 
    $('#fotos').append('<div class="imgdrag"><img class="modal-content" src="' + $(this).attr('src') + '"/></div>'); 
 
    $('.imgdrag').draggable({appendTo: $(".container5")}); 
 
    $('#fotos').droppable(); 
 
    $('.modal-content').resizable(); 
 

 
    $(".download").attr("href", $(this).attr('src')); 
 
    $(".download").show(); 
 
    });

.container5 { 
 
    background-color: transparent; 
 
    width: 220px; 
 
    height: 320px; 
 
    margin: auto; 
 
    top: 0; 
 
    right: 0; 
 
    bottom: 0; 
 
    left: 0; 
 
    border: 1px solid red; 
 
    position: absolute; 
 
    overflow: hidden; 
 
}

<div id="boxes" class="container5" style="float:center;"> 
 
<div id="fotos" class="bananas"><img class="modal-content" id="imgdisplay" /></div></div>

Answer 1

взглянуть на вариант сдерживания для изменяемого размера вы можете ввести селектор, который изменит размер. Вы даже можете использовать родительскую строку, так что он остается в родительском элементе

, например

$('.modal-content').resizable({ 
     containment: "parent" 
});