Mouse Event Issue

Hello,

I am having trouble setting the style.top and style.left of a box with the current coordinates of the mouse. The box is hidden at first, but then when you click a link it displays, I want the box to show up where the mouse currently is. This is important so that I can use this script on other links and have the box be positioned relevant to the link.

Here is the code, let me know what I’m doing wrong:

[code=html]// Setup hooks
function loadRequestPop() {
if (!document.getElementById) return false;

if (document.getElementById(‘requestPopLink’)) {
var x = document.getElementById(‘requestPopLink’);
x.onclick = function() { overlay(this, ‘requestPop’); return false; }
}

if (document.getElementById(‘iconHpRequest’)) {
var icon = document.getElementById(‘iconHpRequest’);
icon.onclick = function() { overlay(this, ‘requestPop’); return false; }
}

if (document.getElementById(‘joinNewsletter’)) {
var test = document.getElementById(‘joinNewsletter’);
test.onclick = function() { overlay(this, ‘joinNewsletterBox’); return false; }
}

if (document.getElementById(‘requestPopClose’)) {
var y = document.getElementById(‘requestPopClose’);
y.onclick = function() { overlayclose(‘requestPop’); return false; }
}

if (document.getElementById(‘whathappenedClose’)) {
var z = document.getElementById(‘whathappenedClose’);
z.onclick = function() { overlayclose(‘whathappened’); return false; }
}

if (document.getElementById(‘joinNewsletterClose’)) {
var b = document.getElementById(‘joinNewsletterClose’);
b.onclick = function() { overlayclose(‘joinNewsletterBox’); return false; }
}

}

//Get Mouse Position
function getMouse(e)
{
var posx = 0;
var posy = 0;
if (!e) var e = window.event;
if (e.pageX || e.pageY)
{
this.posx = e.pageX;
this.posy = e.pageY;
}
else if (e.clientX || e.clientY)
{
this.posx = e.clientX + document.body.scrollLeft;
this.posy = e.clientY + document.body.scrollTop;
}
}

// Create box and display
function overlay(curobj, subobj) {
if (document.getElementById) {
var subobj = document.getElementById(subobj);
subobj.style.left = posx+”px”; // here is my issue
subobj.style.top = posy+”px”;
subobj.style.display = “block”;
return false;
}
else
return true;
}

// Close box
function overlayclose(subobj) {
document.getElementById(subobj).style.display = “none”;
}

addLoadEvent(loadRequestPop);[/code]

Thanks

Also in #JavaScript _↴