Edit Question - KnowledgeHub

Title Body

I've got a simple jQuery sortable based on a list as follows: <ul> <li>Item 1</li> <li>Item 2</li> <li>Item 3</li> <li>Item 4</li> </ul> I've created a helper function so that regardless of what the contents of an item may be, the helper is always the same fixed size. My problem is that if I drag an item that has a lot of content (says several paragraphs of text), even though my helper is only a single line in height, the item will not drop onto the item below until it has travelled at least the original height of my item. For example: <ul> <li>Item 1 line2 line3 line4 line5 </li> <li>Item 2</li> <li>Item 3</li> <li>Item 4</li> </ul> If I drag item1 my helper turns this into a single line - nice and easy to drag. However, I still need to move the mouse 5 lines down the screen before item1 can be dropped between item2 and item3. Once I do drag it sufficient height the item then seems to function as I would expect, and I no longer need to drag it the original height. I've tried all of the sortable options I can think of but to no avail and am hoping that someone has a suggestion. $( '#sortable' ).sortable( { placeholder: 'highlight', axis: 'y', helper: function( event ) { return $( this ).find( '.drag' ).clone(); }, });

Tags (comma-separated) Cancel