Offset function returns wrong value with IE7/position fixed

Reported by:	dprunier	Owned by:	brandon
Priority:	major	Milestone:	1.2.2
Component:	offset	Version:	1.2.1
Keywords:		Cc:
Blocked by:		Blocking:

Description

When querying the offset top of a fixed div in IE7, the scroll is mistakenly counted in the returned value.

Example:

<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
		<title>Test</title>
		<script type="text/javascript" src="js/jquery.js" ></script>
		<script type="text/javascript">
		$(document).ready(function() {
			setInterval(function() {
				$('#fixed').text($('#fixed').offset().top);
			}, 100);
		});
		</script>
	</head>
	<body>
		<div id="fixed" style="position: fixed; 
		                       top: 0px; left: 0px; 
		                       width: 100px; height: 100px; 
		                       background-color: fuchsia;">
		</div>
		<div id="big" style="height: 5000px">
		</div>
	</body>
</html>

Attachments (0)

Change History (8)

Changed December 20, 2007 08:44PM UTC by brandon comment:1

resolution:	→ fixed
status:	new → closed

This is fixed in the latest SVN.

Changed January 16, 2008 03:29PM UTC by dprunier comment:2

resolution:	fixed
status:	closed → reopened

The test sample in the description still doesn't work. This is actually broken in both IE7 and FF now (1.2.2, r4454).

Changed January 18, 2008 11:33PM UTC by brandon comment:3

resolution:	→ fixed
status:	reopened → closed

This is fixed. Please see the modified test case that places a div at the elements location here: http://brandonaaron.net/jquery/tickets/2082/test.html

If the scroll offset is not included then the marker div will not be placed correctly.

This was fixed for all supported browsers in 1.2.2. There is also now an offset test suite that can be found in test/offset.html

Changed May 16, 2008 08:01PM UTC by manolofdez85 comment:4

resolution:	fixed
status:	closed → reopened

Is this bug really fixed??

I tried the following and still does not work

<html>
<head>
<title>Offset</title>
<style>
html, body{
padding:0px;
margin:0px;
}
</style>
<script type="text/javascript" src="js/jquery.js">void(0);</script>
<script type="text/javascript">
	$(document).ready(function(){
		$("img").click(function(){
			var offset = $(this).offset();
			alert("Wrong: " + offset.left + ", " + offset.top)
			alert("Write: " + $(this).get(0).offsetLeft + ", " + $(this).get(0).offsetTop)
		});
	});
</script>

</head>

<body>
<img src="http://images.google.com/intl/en_ALL/images/images_hp.gif" />

</body>
</html>

Thanks in advance!!

Changed January 10, 2009 10:58PM UTC by dmethvin comment:5

owner:	→ brandon
status:	reopened → new

Confirmed that the test case returns "Wrong: 2,2" "Right: 0, 0" for the test case above.

Changed January 10, 2009 10:58PM UTC by dmethvin comment:6

Test case broken for IE7...

Changed January 10, 2009 10:59PM UTC by dmethvin comment:7

component:	core → offset

Changed March 17, 2009 09:20PM UTC by brandon comment:8

resolution:	→ fixed
status:	new → closed

This is fixed and has been fixed for a very long time now.

You can't just compare offsetLeft and offsetTop to the _actual_ offset of an element. The offset of an element is its position from the top left of the document. Please see the following test case to hopefully better understand. http://jquery.com/test/data/offset/fixed.html

Click either other two white boxes and a marker will be placed on top of the element you clicked. This is the true offset ... not its offsetLeft and offsetTop which shouldn't even be trusted for relative offset.

Side navigation

#2082 closed bug (fixed)