Ticket #8022 (closed bug: invalid)
.offset() and .css("top")/.css("left") do not work properly when element is hidden
| Reported by: | Senator | Owned by: | Senator |
|---|---|---|---|
| Priority: | low | Milestone: | 1.next |
| Component: | css | Version: | 1.4.4 |
| Keywords: | Cc: | ||
| Blocking: | Blocked by: |
Description
If an element is hidden ("display" property has the "none" value), I cannot get its position as both .offset() and .css() methods return 0.
Interestingly, both methods do not work in Firefox (3.6.13 in my case) and IE (9.0.7930) but they do work correctly in Chrome (10.0.634.0) and Opera (11.00). It seems therefore that the problem is browser-specific.
Change History
comment:1 Changed 2 years ago by jitter
- Owner set to Senator
- Priority changed from undecided to low
- Status changed from new to pending
- Component changed from unfiled to css
comment:2 Changed 2 years ago by Senator
- Status changed from pending to new
As you requested, I created a simple test case on the jsFiddle website. You can reproduce the the issue by following this link.
comment:3 Changed 2 years ago by addyosmani
- Status changed from new to open
I've tested this in Chrome, IE9 and Firefox 3.6.13. At the moment Firefox is the only one I've found where the expected values aren't obtained.
comment:4 Changed 2 years ago by Senator
The methods do work correctly in IE9. Sorry for misleading you. They also work correctly in Firefox 4 (beta 7), so the only browser where they return unexpected values is Firefox 3.
comment:5 Changed 2 years ago by Senator
I've updated the test case so that it now allows to test the .offset() method along with the .css() method.
comment:6 follow-up: ↓ 7 Changed 2 years ago by red+bugs@…
potentially related: in Firefox, .offset() does not account for -moz-transform: translate(x,y) changes, whereas chrome & Safari both account for -webkit-transform: translate().
comment:7 in reply to: ↑ 6 Changed 2 years ago by red+bugs@…
Replying to red+bugs@…:
potentially related: in Firefox, .offset() does not account for -moz-transform: translate(x,y) changes, whereas chrome & Safari both account for -webkit-transform: translate().
comment:8 in reply to: ↑ description Changed 2 years ago by websites.comunicacao@…
Replying to Senator:
If an element is hidden ("display" property has the "none" value), I cannot get its position as both .offset() and .css() methods return 0.
Interestingly, both methods do not work in Firefox (3.6.13 in my case) and IE (9.0.7930) but they do work correctly in Chrome (10.0.634.0) and Opera (11.00). It seems therefore that the problem is browser-specific.
estou com o mesmo problema, no firefox
comment:9 Changed 2 years ago by timmywil
Just encountered this problem on one of my own sites. Swapped display: none to visibility to get correct values. I will probably do a pull request, but for now, here is a fiddle. http://jsfiddle.net/timmywil/KNGDH/3/
comment:10 Changed 2 years ago by spongman
I was just going to file this. Here's my test case: http://jsfiddle.net/LcX7C/1/
comment:11 Changed 2 years ago by scott.gonzalez
This isn't a bug, this is documented functionality. Importantly, this isn't something jQuery can properly account for. From the offset docs:
Note: jQuery does not support getting the offset coordinates of hidden elements or accounting for borders, margins, or padding set on the body element.
comment:12 Changed 2 years ago by jitter
- Status changed from open to closed
- Resolution set to invalid
As noted by scott.gonzalez this isn't a bug but specified behavior.
Please follow the bug reporting guidlines and use jsFiddle when providing test cases and demonstrations instead of pasting the code in the ticket.

Thanks for taking the time to contribute to the jQuery project by writing a bug report.
Please submit a reduced test case, which reproduces the issue you are experiencing, on http://jsfiddle.net. So that we can investigate this issue further.
How to report bugs