2

I've got a bunch of draggable elements, and the droppable elements that receive them are in a div that is set to overflow-y: scroll.

The 'scroll' option of draggable works to scroll the whole page, but I cannot get it to scroll the parent div of the droppables. I've tried changing the containment attribute of the draggable to be the droppables' parent on hover, but that doesn't work either.

If anyone knows of a way to do this, I'd greatly appreciate it. Here's the basic idea of what I'm trying to do: http://jsfiddle.net/4gMVf/5/

awseward
  • 53
  • 1
  • 7

1 Answers1

7

I forked your fiddle, and folded in this nifty solution.

Check it out: http://jsfiddle.net/crowjonah/Fr7u8/2/ There are a couple anchor areas that, when dragged over, will autoscroll the droppable.

I, like him, gave the anchors some visibility so you can see how they're working. You'll most likely want them totally transparent for end use.

I can't be sure, but it seems like you've got some other issues with your droppable, though, as it doesn't seem to be accepting your draggables, but since that wasn't your question, I won't try and solve that problem.

Community
  • 1
  • 1
crowjonah
  • 2,858
  • 1
  • 23
  • 27
  • That looks great, thanks so much for that idea. Oh, and the droppables are accepting, they just weren't doing anything with the drop event in that first fiddle I posted. http://jsfiddle.net/4gMVf/8/ – awseward Sep 11 '12 at 23:00