Element#getOffsetParent IE issue (effects several other methods)
Reported by Padraig Kennedy | May 9th, 2008 @ 06:38 PM | in 1.6.0.3
Element.clonePosition causes an error in IE7 when run on elements with position: absolute;
This is due to IE7 not returning a value for the viewportOffset(); function the first time it is called.
The error thrown by IE7 is: 'style' is null or not an object.
The attached file includes a test case which will cause the error.
Thanks,
Pádraig.
Comments and changes to this ticket
-
Padraig Kennedy May 9th, 2008 @ 07:39 PM
Looked into this further.
It seems that since the element is 'HTML' in this case the initial ifs don't catch it. The while loop then tries to get the positioning of the HTML parentNode, which doesn't have a style attribute, so it errors.
Adding in another 'if' to test for 'HTML' and returning the element itself seems to solve it.
Hope this helps,
Pádraig.
getOffsetParent: function(element) { if (element.offsetParent) return $(element.offsetParent); if (element == document.body) return $(element); if (element.nodeName == 'HTML') return $(element); // This is added while ((element = element.parentNode) && element != document.body) { if (Element.getStyle(element, 'position') != 'static') { return $(element); } } return $(document.body); }, -
Juriy Zaytsev May 9th, 2008 @ 09:26 PM
This should be fixed in a trunk version.
Could you check if it solves the issue?
-
Padraig Kennedy May 10th, 2008 @ 12:18 PM
I downloaded and built the latest version from git just now, and the problem is still there.
The IE wrapper on the getViewportOffset function calls getOffsetParent on the 'html' element which causes the error described above.
PK
-
-
-
John-David Dalton May 13th, 2008 @ 05:39 PM
- → Milestone changed from “” to “1.6.0.3”
- → Title changed from “clonePosition() problem in IE7” to “Element#getOffsetParent() IE issue (effects several other methods)”
- → State changed from “new” to “bug”
Padraig Kennedy can you try my fork -> I have fixed the offsetParent bug via:
2) [ #11473 ] Element#getOffsetParent and Element#viewportOffset IE error:
-
-
John-David Dalton May 13th, 2008 @ 05:41 PM
- → Assigned user changed from “” to “John-David Dalton”
-
John-David Dalton May 13th, 2008 @ 08:24 PM
- → Title changed from “Element#getOffsetParent() IE issue (effects several other methods)” to “Element#getOffsetParent IE issue (effects several other methods)”
-
Nick Stakenburg May 14th, 2008 @ 02:14 AM
It's more complex then the patch needed for the issue discribed here or what's discribed as fixed in the patched changelog. Seems like this approach fixes another issue alltogether with strict doctypes, nice work.
-
John-David Dalton May 14th, 2008 @ 02:31 AM
Thanx,
Well, my patch fixes issues with methods like clonePosition, viewportOffset, and getOffsetParent because they all suffered from the same issue of incorrectly getting documentElement back as the offsetParent instead of document.body.
I don't think its more complex than needed to fix the issue, I think it simply addresses the issue.
The changelog reflects the symptom of the issue reported. Though the actuall fix is deeper than that. I will put a note on the commit about a possible edit.
A related ticket for viewportOffset and Opera is here
-
Nick Stakenburg May 14th, 2008 @ 03:16 AM
The reason I think it's complex is because the IE style bug discussed here is fixed in Andrew's branch like this:
http://github.com/savetheclockto...
That ensures you don't end up with the document node, effectively fixing the style issue. Your patch introduces returning document.body over document.documentElement in getOffsetParent, a good thing imo.
I opened the related ticket for Opera a while back, it was added in the same commit:
http://github.com/savetheclockto...
related to that:
-
Padraig Kennedy May 14th, 2008 @ 12:06 PM
Hi John,
I tested it with your fork and the issue is resolved.
Thanks,
Pádraig.
-
John-David Dalton May 14th, 2008 @ 02:55 PM
Ahh nodeType == 9, pretty cool :)
In regards to the Opera fix, so that patch makes Opera 9.5 work? I am not familiar with the bug, so forgive my ignorance. What about the previous versions of Opera that have the bug? Won’t checking for the HTML tag instead of the BODY cause them to fail?
By the way, I never put togeather that you where "staaky" until now :)
-
Nick Stakenburg May 14th, 2008 @ 03:07 PM
Yes, it makes it works on Opera 9.5. The problem was that scrollTop and scrollLeft are set on both the HTML and the BODY element in previous versions of Opera. Opera 9.5 now supports it like other browsers, having those properties only on the HTML element. Without the patch an invalid offset is returned in Opera 9.5. The patch is backwards compatible.
-
John-David Dalton May 16th, 2008 @ 04:00 PM
Andrew's patch will fail this unit test:
/* IE with strict doctype may try to return documentElement as offsetParent on relatively positioned elements */ $(document.body).insert( new Element('div', {id:'ie_offset_parent_bug'}).setStyle('position:relative')); this.assertEqual('BODY', $('ie_offset_parent_bug').getOffsetParent().tagName.toUpperCase());because it assumes the element.offsetParent is correct.
-
Nick Stakenburg May 17th, 2008 @ 03:57 PM
I'm for returning document.body over document.documentElement, but also for simplicity. How about this approach?
getOffsetParent: function(element) { element = $(element); var op = element.offsetParent; if (op && op != document.documentElement) return $(op); while ((element = element.parentNode) && element.tagName.toUpperCase() != 'HTML') if (Element.getStyle(element, 'position') != 'static') return $(element); return $(document.body); }, -
-
Taco van den Broek June 3rd, 2008 @ 04:52 PM
@John-David: In reply to to ticket #134 regarding this issue I've proposed another fix and added some unit tests. Please take a look at my reply and patch.
-
Please Login or create a free account to add a new comment.
You can update this ticket by sending an email to from your email client. (help)
Create your profile
Help contribute to this project by taking a few moments to create your personal profile. Create your profile »
The Prototype JavaScript library.
