

Jquery ui draggable overflow x how to#
Why and how to fix this is out of my scope ) Please note, that while this patches the problem (in a bad way!), this doesn't work if you make an initial scroll before starting the drag. Ui.position.top -= $('body').scrollTop() Ui.position.top -= $('html').scrollTop() It seems that the issue is browser specific, and this can be tested using the following code: I did however make an interesting discovery. I've been fiddling around for a while now, trying to find a patching solution for my own site, rather that a fix, so sorry about that. I quickly jump in to this discussion as I have the same issue. I have tested this change in Internet Explorer 7, Opera 9.63 and Firefox 3.0.5. If(! || != "x") = +'px' įixes this problem completely. Using the position value causes the helper's top to be -1*(scroll offset) off, causing the helper to be off of the mouse cursor by the scroll offset.Ĭhanging _mouseDrag to use positionAbs, such as: In Internet Explorer, the position and absolute position vary greatly. Unfortunately, in Internet Explorer this causes the helper to have an incorrect offset when the page is scrolled.

The _mouseDrag function sets the helper style as such: The jQuery UI's draggable helper is using the wrong offset.
