javascript - ドラッグ可能な要素を div-border で停止させる

Question

私の体には、wrapperdivにいくつかの画像があります:

<div id="wrapper">
    <img src="1.png" id="img1" />
    <img src="2.png" id="img2" />
    <img src="3.png" id="img3" />
</div>

これらはすべて jQueryUI でドラッグ可能です。

var $images = $('#img1, #img2, #img3')
    $images.draggable({ start: dragStart,
                        cursor: 'move',
                        stop: dragEnd });

すべての要素がposition: absolute;あり、ラッパーには固定があります。width: 1000px; height: 800px
私が知りたいのはimg、div の終わりと衝突したときにドラッグを停止し、衝突した場合にイベントを発生させることができるかどうかです。