追加draggable到容器jquery

我遇到一個小問題，每次從我的畫廊選擇一個圖像的圖像顯示到一個容器我可以調整大小和拖動容器內的圖像我的問題是，圖像時，我拖動圖像超出容器我想要的是圖像停止在容器上我不希望它隱藏。如何才能使這成爲可能？這裏是我所擁有的我沒有工作可拖動東陽，這將需要編碼我只是要發佈的腳本和一些CSS和HTML追加draggable到容器jquery

$('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>

來源

2017-02-19 rookie cookie

看一看遏制選項很多爲了調整大小，您可以輸入可調整大小的選擇器。你甚至可以使用父字符串，使其保持在父元素

例如

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

來源

2017-02-19 21:47:25

它仍然隱藏 –

有看看的jsfiddle [這裏]容器背後沒有工作（HTTPS：/ /jsfiddle.net/mgoo/x06dg7ec/）的完整示例。你也可以看一下文檔[here]（http://api.jqueryui.com/resizable/#option-containment） –

追加draggable到容器jquery

回答

相關問題