Draggables do not properly account for scrollHeight in Firefox 8 or 9.

[nathanhammond]

Reduced test case: ​https://gist.github.com/1558920

Platform: Mac OS X 10.6.8 Affected Browsers: Firefox 8.0.1, Firefox 9.0.1

Reproduction steps:

1. Load the test case in Firefox for Mac. (​file:// protocol is fine)
2. Scroll down.
3. Click and drag any "tile."
4. Note that the tile jumps upward by page's scrollHeight.

The bug is caused by this CSS declaration: html { overflow-y: scroll; }

Removing that style rule eliminates the jump. However, that is a style rule that is pretty well considered best practice (forcing a vertical scroll bar) evidenced by its inclusion in H5BP.

[nathanhammond]

I've tracked down the issue as far as the first call to this._generatePosition(event) in the draggable module returning a negative value for top that is equivalent to:

this.offset.top - this.offset.relative.top

The value by which Firefox is incorrect is the result of math occurring with those two values.

[nathanhammond]

Tracked it down to a single issue:

( scrollIsRootNode ? 0 : scroll.scrollTop() )

This appears inside the _generatePosition function in the return object.

scrollIsRootNode evaluates to true, but we want the value for scroll.scrollTop() to be returned in Firefox instead of 0.

Proposed change:

( scrollIsRootNode && !$.browser.mozilla ? 0 : scroll.scrollTop() )

I don't know the full impact of making that change, but it resolves this bug.

[chris_staite]

I think this is the same issue I had. The issue was with the scrollParent function. In Firefox 11 (maybe earlier?), it needs to operate like it does in MSIE. I modified the scrollParent function if statement from

if ($.browser.msie

to

if (($.browser.msie || ($.browser.mozilla && $.browser.version == "11.0"))

This fixes it in Firefox, the version testing needs to be performed. Also, it might break other things, but I don't know.

[mikesherov]

Duplicate of #5718.