Event when dragging item out of menu

Question

I have a menu of images that I can drag out of the list and will snap back in place using packery

<div id="menu">
        <div class="img">
               <Img src="..."/>
        </div>

I would like to know when one of the the images is dragged outside of the list. I tried a lot of MouseEvent Listeners but because the image stays under my mouse I never really leave the div.

At the moment I use the position of the cursor and compare it relatively to the border of the menu but I was wondering if there was a cleaner way to accomplish this in native JS or jQuery

Answer 1

You can use the SortableJS library. Supported by: Vue, React, Angular, Knockout, Meteor, Polymer, Ember, and other.