/    Sign up×
Community /Pin to ProfileBookmark

div element x y offset problem vs pointer

I have found a problem with the coordinates of the cursor vs the coordinates of a div element in ie7. Not sure about earlier versions. Works fine in firefox. If you look at [url]http://www.premierecolors.com/testpos2.html[/url]. I have placed that div at 0,0. If I drag down slowly, it will fire from the mouseover when it touches the top of the div. The div is positioned at 0. The cursor always shows 2 in ie. If you do the same thing in firefox, it always shows 0 for the pointer. It works the same from the left. If I add mousemove code, you can see the position changing above and to the left of the div even though it is located at 0,0. See this example:
[url]http://www.premierecolors.com/TESTPOs3.HTML[/url]
I added an onmousemove to continuously update the mouse coordinates. If you start at the top or left, you can see the cursor go from 0 to 1 and then when it hits 2, it fires the mouseover and shows the div coordinates. The div is positioned at 0,0 the div coords should show the first time the pointer position changes. I think there is another offset that is in ie7 that is 2 pixels that is not being accounted for or there is a bug. It works fine in firefox.

Thanks in advance for any help, Troy

to post a comment
JavaScript

9 Comments(s)

Copy linkTweet thisAlerts:
@troyd1authorOct 05.2007 — If anyone is willing to give this a try, would you please post your browser and version and what happened.
Copy linkTweet thisAlerts:
@Angry_Black_ManOct 05.2007 — ie6 has the same symptoms as 7 it appears. but i would be at a total loss to guess what the culprit is. i tried to stick the following in the body tag, but it didnt make a difference:

topmargin="0" leftmargin="0" marginwidth="0" marginheight="0"
Copy linkTweet thisAlerts:
@troyd1authorOct 05.2007 — I thought maybe it had something to do with the tabbed browser, but I guess not. I was thinking there may be an offset missing. How do you go about reporting a bug in a browser?
Copy linkTweet thisAlerts:
@felgallOct 05.2007 — Microsoft will not care about another IE6 bug. There are already thousands of known bugs in IE6 including about 600+ that relate to security. Microsoft plugged most of the security related bugs by creating IE7 but they don't seem to concerned about any of the others.

Do you have the following line in your stylesheet?

html, body {margin : 0; padding : 0;}

If it is a margin or padding issue then that line would fix it.
Copy linkTweet thisAlerts:
@troyd1authorOct 05.2007 — I just tried that with http://www.premierecolors.com/testpos4.html but the results are the same.
Copy linkTweet thisAlerts:
@mrhooOct 05.2007 — I tried your page in IE7 with the style div{padding:0} and got the results you're looking for. To work the same in IE6 you need to set a doctype.
Copy linkTweet thisAlerts:
@troyd1authorOct 05.2007 — Mrhoo, what should I set the doctype to? Please post an example line.
Copy linkTweet thisAlerts:
@mrhooOct 05.2007 — This will work:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
Copy linkTweet thisAlerts:
@troyd1authorOct 05.2007 — I made the change in http://www.premierecolors.com/testpos4.html but the results are still the same. Did I forget something?
×

Success!

Help @troyd1 spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 BETA 5.19,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...