I've seen similar problems when using scrollable divs and the drag/drop features of Scriptaculous. It seems to be caused by the fact that Scriptaculous's drag/drop features don't account for the scrolling of intermediate widgets between an element's real position on the screen and its position relative to the document.
It's discussed here a bit: https://prototype.lighthouseapp.com/projects/8887/tickets/122-scrollbar-causes-drag-drop-to-fail#ticket-122-6 After spending some time trying to figure out where to fix this issue, I ended up writing a couple of hackish scripts to find the REAL scrolling x/y coordinates, even when nesting scrolling divs as follows: function getTotalScrollLeft(n) { var ret = 0; if (n.parentNode) ret = getTotalScrollLeft(n.parentNode); if (n.scrollLeft) ret = ret + n.scrollLeft; return ret; } function getTotalScrollTop(n) { var ret = 0; if (n.parentNode) ret = getTotalScrollTop(n.parentNode); if (n.scrollTop) ret = ret + n.scrollTop; return ret; } On Tue, Jul 6, 2010 at 8:17 AM, Yuri Leikind <yuri.leik...@gmail.com> wrote: > Hello all, > > I am stuck here with a problem. > > There's a scrollable div on a page (overflow-y: scroll) with > draggables inside, I will call them draggables type A for the sake of > simplicity. There's a droppable area for draggables of type A. > Dragging these from inside the scrollable area works perfectly well, > and they are visible. > > There are also draggables of type B in another div, and I need to > enable dropping them to the same scrollable div which contains > draggables of type A. I declare this scrollable div as a droppable for > draggables of type B, and I can drag & drop them, no problem here. > But! As soon as this div is declared as a droppable area, dragging of > draggables of type A changes - they are not visible when they are > outside of their scrollable parent div, though they can be dropped. > > Setting overflow to 'none' fixes the issue, but I need that scrolling. > > I've been googling, but to no avail. > > I tried > > starteffect: function(e){ > e.setStyle({'position':'absolute', 'z-index': 1001}); > } > > but it doesn't change anything. > > What am I missing? I would appreciate any hints. > > I am using Prototype 1.6.1, scriptaculous 1.8.3, testing it in Safari > 5.0 and Firefox 3.6.6 > > Best regards, > Yuri Leikind > > -- > You received this message because you are subscribed to the Google Groups > "Prototype & script.aculo.us" group. > To post to this group, send email to > prototype-scriptacul...@googlegroups.com. > To unsubscribe from this group, send email to > prototype-scriptaculous+unsubscr...@googlegroups.com<prototype-scriptaculous%2bunsubscr...@googlegroups.com> > . > For more options, visit this group at > http://groups.google.com/group/prototype-scriptaculous?hl=en. > > -- You received this message because you are subscribed to the Google Groups "Prototype & script.aculo.us" group. To post to this group, send email to prototype-scriptacul...@googlegroups.com. To unsubscribe from this group, send email to prototype-scriptaculous+unsubscr...@googlegroups.com. For more options, visit this group at http://groups.google.com/group/prototype-scriptaculous?hl=en.
