Bug Tracker

Opened 12 years ago

Closed 9 years ago

Last modified 9 years ago

#6446 closed bug (fixed)

Mobile Safari 4.0.4: $.offset.top() reports wrong position after scroll

Reported by: matas Owned by:
Priority: high Milestone: 1.9
Component: offset Version: 1.4.2
Keywords: iphone, ipad, scroll Cc:
Blocked by: Blocking:


demonstration: http://fiddle.jshell.net/G9ZAR/show/light/

source: http://fiddle.jshell.net/G9ZAR

click on the first link, click on the second.

Safari 4.0.5 shows offset().top 390 Mobile Safari 4.0.4 (on iPad) shows offset().top 780

it seems that after vertical scroll, the scrollTop get's added to the actual position.

Change History (17)

comment:1 Changed 12 years ago by edwincheese

comment:2 Changed 12 years ago by jakecigar

my workaround is

$.browser.mobileSafari = /webkit.*mobile/i.test(navigator.userAgent) $.fn.cssKluge=function(css){

if ($.browser.mobileSafari){

css.top-=window.scrollY css.left-=window.scrollX

} return this.css(css)


comment:3 Changed 11 years ago by matas

thanks jake,

here's my (dirty) take on the override: http://gist.github.com/431639

what would be a clean solution? probably adding an absolutely positioned element to an iframe, scrolling it and then testing for the offset === position

comment:4 Changed 11 years ago by rty

Small improvement to previous for old safari versions compatibility: http://gist.github.com/gists/434145

comment:5 Changed 11 years ago by rty

Thanks matas for good decision!

comment:6 Changed 11 years ago by ellemme

rty I've added an extra test vs iOS version since the bug occurs only on 3.2-4.0.x, 4.1 is not affected. Feel free to add the following test condition to your snipplet:

/; CPU.*OS (?:3_2|4_0)/i.test(navigator.userAgent)

comment:7 Changed 11 years ago by addyosmani

Priority: undecided
Status: newopen

comment:8 Changed 11 years ago by [email protected]

Just thought I'd add my own little detection JS to the mix. It's a lot smaller than others but relies completely on the user agent string:


comment:9 Changed 11 years ago by markedwards

I've found that calculating the offset with straight javascript seems to work. Test page:


Clicking the yellow square shows the top and left as calculated by jQuery as well as straight javascript. They should always be the same, but on iOS <4.1 they are not if you scroll anywhere.

So, is this indeed simply a bug in jQuery? Anyway, a workaround that doesn't involve browser detection might be to not use jQuery to calculate the top and left.

comment:10 Changed 11 years ago by snover

Milestone: 1.4.3

Resetting milestone to future.

comment:11 Changed 11 years ago by cellartracker

For all those using the workaround function hack, you *might* want to test result for null before you start subtracting. (I had some poorly behaved code that happens to call offset and get a null. The workaround function exploded in the same scenario...)

comment:12 Changed 11 years ago by john

Milestone: 1.next
Priority: undecidedhigh

comment:13 Changed 10 years ago by [email protected]

This actually occurs on the desktop as well... test a mobile web-app in Chrome by scrolling and then clicking on your target -- gets the same result as mobile safari.

comment:14 Changed 10 years ago by Rick Waldron

"test a mobile web-app in Chrome" any suggestions?

comment:15 Changed 9 years ago by jethrolarson

Reduced Test case that shows the bug in IOS 4.0.2 and others. http://jsbin.com/ofoqoc/5

comment:16 Changed 9 years ago by mikesherov

Milestone: 1.next1.9
Resolution: fixed
Status: openclosed

This works in latest http://jsbin.com/ofoqoc/6/edit

comment:17 in reply to:  1 Changed 9 years ago by anonymous

Replying to edwincheese:

+1 Same issue as reported in JQuery forum: http://forum.jquery.com/topic/offset-returns-incorrect-values-in-ipad

Note: See TracTickets for help on using tickets.