div positioning not working as expected

J

jon23d

Good afternoon,

I am trying to get a pop-up div to position itself relative to the
mouse position when a user clicks on a link. The positioning is
working fine in every browser except IE where it is positioned properly
on the left, but not the top is at the very top of the page instead of
at tempx-175px... Here is my code, can anyone see what I am doing
wrong?

function revealMenu(e, elementID){
// get x,y
if (document.all) {
// for IE
tempX = e.clientX + document.body.scrollLeft;
tempY = e.clientY + document.body.scrollTop;
} else {
// for everything else
tempX = e.pageX;
tempY = e.pageY;
}
document.getElementById(elementID).style.top=(tempY-175)+'px';
document.getElementById(elementID).style.left=(tempX-175)+'px';
document.getElementById(elementID).style.visibility = "visible";
}
 
M

mertas

Try this one. It's a little different from yours, but it works fine in
IE and FF (i didn't test in others).

<body style="padding:0px; margin:0px;">
<div onClick='revealMenu(event);' style="position:relative; width:200%;
height:200%;">

<div id="mydiv" style="position:absolute; border:1px solid
red;">123</div>

</div>

<script>
function revealMenu(e){
var posx = 0;
var posy = 0;
if (!e) var e = window.event;
if (e.pageX || e.pageY)
{
posx = e.pageX;
posy = e.pageY;
}
else if (e.clientX || e.clientY)
{
posx = e.clientX + document.body.scrollLeft;
posy = e.clientY + document.body.scrollTop;
}
document.getElementById('mydiv').style.top=(posy)+'px';
document.getElementById('mydiv').style.left=(posx)+'px';
}
</script>
</body>
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

Forum statistics

Threads
473,770
Messages
2,569,584
Members
45,075
Latest member
MakersCBDBloodSupport

Latest Threads

Top