Element#cumulativeOffset and positionedOffset need to check for offsetTop and offsetLeft bugs
Reported by John-David Dalton | June 25th, 2008 @ 02:23 AM | in 1.6.1
Garrett Smith has pointed out various bugs with offsetTop and
offsetLeft and we need to create a patch for their use in
Element#cumulativeOffset and Element#positionedOffset.
Method cumulativeOffsets doesn't account for the many problems:
- Doesn't account for body.offsetTop ignoring BODY's margin.
- Doesn't account for BODY being a magic offsetParent.
- Doesn't add parentNode borderWidth / clientLeft/Top.
- Doesn't consider Moz bug with border on BODY. [bug report]
A simple example can demonstrate a few of these:
<!DOCTYPE html>
<html>
<head><title>offsetTop border parent</title>
<script src="../library/prototype-1.6.0.2.js"></script>
</head>
<body style="border: 10px solid;margin:10px;">
<div style='border: 1px solid red;position:relative' id='a'>a</div>
</body>
</html>
Now Try:
javascript:alert(Element.Methods.cumulativeOffset(document.getElementById('a')))
Comments and changes to this ticket
-
John-David Dalton June 25th, 2008 @ 02:26 AM
- → State changed from “new” to “bug”
-
DrLongGhost July 11th, 2008 @ 05:16 PM
- no changes were found...
-
John-David Dalton July 11th, 2008 @ 05:30 PM
Useful resources:
- http://dhtmlkitchen.com/ape/test/tests/dom/position-f-test.html
- http://dhtmlkitchen.com/ape/example/dom/getOffsetCoords.html
The css-d list includes a variation of the function in Prototype and explanations for why it doesn't work.
- http://lists.w3.org/Archives/Public/www-style/2008Mar/0265.html
- http://lists.w3.org/Archives/Public/www-style/2008Mar/0147.html
- http://lists.w3.org/Archives/Public/www-style/2008Apr/0440.html
Other resources:
- http://www.w3.org/Search/Mail/Pu...
- http://www.javascripttoolbox.com/lib/objectposition/source.php
- Take a look at some other functions: Yahoo's getXY, Brandon Aaron's dimensions plugin
-
John-David Dalton July 2nd, 2008 @ 04:24 PM
- → Tag changed from “” to “needs_patch needs_tests”
- → Milestone changed from “1.6.0.3” to “1.6.1”
I don't see this gettign fixed until 1.6.1 :(
-
DrLongGhost July 11th, 2008 @ 05:16 PM
Thanks for posting the link to the APE.dom functions in this ticket. I am in the process of porting my employer's website from dojo 0.4 to prototype 1.6 and have found that positionedOffset() throws an error in IE when I attempt to call it on a newly inserted element.
Unfortunately, I don't really have time to debug this further and am for the moment settling myself with including APE.dom and using their APE.dom.getOffsetCoords() function (which does not throw an error in IE).
I would love to see this get fixed in a future version of prototype so I could remove this extraneous library. You might also consider looking at dojo 0.4's dojo.html.abs() function which also worked without errors in IE on my newly inserted element.
I have attached the code which throws the error in IE in case it would help. Thanks.
-
John-David Dalton July 11th, 2008 @ 05:24 PM
@DrLongGhost - your issue is not with the position methods.
You are using Prototype incorrectly.
You should create a new element via
var foo = new Element('input', {type:'text'});to ensure you receive an extended element.
IE doesn't extend elements natively through the Element.prototype
so they must be extended manually before use.
The new Element method ensures this happens.
-
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.
