Menu
I want little ‘help divs’ to appear when people click on icons dotted about a page.
Is there a way of making them appear relative to the screen?
position:absolute makes them appear relative to the left of the page (which is constant) but also relative to the top of the page (which is not constant because it might have been scrolled)
I want the divs to appear next to where the person clicked but I want them half way between the current top and bottom of the page (i.e. the screen).
At the moment I have:
function showhelp(whichdiv,e,divheight)
{
var divleft;
var divtop;
e = e || event;
if (e.clientX > (screen.availWidth/2))
{ divleft = e.clientX – 330; }
else
{ divleft = e.clientX + 30; }
divtop = (screen.availHeight – divheight)/2 + document.body.scrollTop – 50;
document.getElementById(whichdiv).style.display = ‘block’;
document.getElementById(whichdiv).style.left = divleft + ‘px’;
document.getElementById(whichdiv).style.top = divtop + ‘px’;
}
This works but I am having to use ‘scrollTop’ and not sure this will work with all browsers. Is there another way?
Thanks for any help.