0

I'm currently attempting to implement drag and drop functionality, so far it works fine up until you have a scrollable div.

If you drag an item into the drop area, it highlights fine. But as soon as you scroll (without moving the mouse) it stays on the last item you we're dropping on, rather than the one it has moved to. Is there any way to cause the draggable to 'refresh' when the mouse hasn't moved?

I thought of maybe setting up an interval in the 'start' of the draggable: 

$('.drag_me').draggable({
    helper: "clone",
    scroll: true,
    refreshPositions: true,
    start: function (event, ui) {
          updateHandler = setInterval(function () {
              //what goes here?
          }, timer);
    }
});

but I wouldn't be sure on what I would call to update the positions.

Here is a jsFiddle showing it in action (drag an item over the box, make sure the mouse is still then scroll)

http://jsfiddle.net/LLPQQ/

kiwijus
  • 1,217
  • 1
  • 20
  • 40
  • This is discussed [Here =>jQuery draggable shows helper in wrong place when scrolled down page][1] [1]: http://stackoverflow.com/questions/5791886/jquery-draggable-shows-helper-in-wrong-place-when-scrolled-down-page – natchkebiailia Apr 21 '14 at 16:17
  • The user will still have to move the mouse to highlight, but this solution with remove the previous highlight while scrolling. `$('.drop_area').scroll(function() { $(this).trigger('mousemove'); });` http://jsfiddle.net/LLPQQ/2/ – Trevor Apr 21 '14 at 16:21
  • @Mr.ILIA I think that's something different, the draggable appears in the right place, its the hover state that's wrong. – kiwijus Apr 21 '14 at 18:01

0 Answers0