[SOLVED] finding page position?

[Stickybomb]

ok i want to display a div in the absolute center of the page no matter where the page is. lets say that the page is realy long and dispite how far down they are i want to be able to display a div in the absolute center. i have a series of text links throughout my document that i am using to show the div, and the cotntent of the div is being controlled by which link they click on using ajax. i have a mild understanding of javascript i am just little slow on the event handle i guess. i looked on google and got some code and attempted something however i don't think it took any of the values since it still goes back to the top of the page when i click on a link near the bottom. if anyone has any suggestions or ideas or help with this i would appriciate it

 

this is the javascript that i am using for the ajax

 

var xmlHttp

function show(str)
{ 
xmlHttp=GetXmlHttpObject()
if (xmlHttp==null)
{
alert ("Browser does not support HTTP Request")
return
} 
var url="../inc/pop.php"
url=url+"?img="+str
url=url+"&action=show"
url=url+"&sid="+Math.random()
xmlHttp.onreadystatechange=stateChanged 
xmlHttp.open("GET",url,true)
xmlHttp.send(null)
}

function hide()
{ 
xmlHttp=GetXmlHttpObject()
if (xmlHttp==null)
{
alert ("Browser does not support HTTP Request")
return
} 
var url="../inc/pop.php"
url=url+"?action=hide"
url=url+"&sid="+Math.random()
xmlHttp.onreadystatechange=stateChanged 
xmlHttp.open("GET",url,true)
xmlHttp.send(null)
}

function stateChanged() 
{ 
if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete")
{
if (window.innerWidth){
var xpos = window.innerWidth/2;
var ypos = (window.innerHeight/2)+window.pageYOffset;
}
if (document.all){
var xpos =  document.body.clientWidth/2;
var ypos =  (document.body.clientHeight/2)+document.body.scrollTop;
}
xpos = xpos - (document.getElementById("viewer").style.width/2);
//xpos = xpos - (document.getElementById("viewer").style.width/2);
document.getElementById("viewer").style.left=xpos+"px";
document.getElementById("viewer").style.top=ypos+"px";
document.getElementById("viewer").innerHTML=xmlHttp.responseText 
} 
}

function GetXmlHttpObject()
{
var xmlHttp=null;
try
{
// Firefox, Opera 8.0+, Safari
xmlHttp=new XMLHttpRequest();
}
catch (e)
{
//Internet Explorer
try
  {
  xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
  }
catch (e)
  {
  xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
}
return xmlHttp;
}

 

this is the css of the div

 

#viewer {
position:absolute;
left:400px;
top:300px;
z-index: 1000;
width:371px;
height:auto;
}

[fenway]

Well, you should be able to use scroll offsets to find out "where" you are relative to the "top".

[Stickybomb]

thats what i tried and it did not work if you look at my code bascially i find the width of the browesr and the height and divide them in half to get the center coords then subtract half the width of the div from the width to center it horizontally and add the scrolloffset to the height to get the vertical position and pass them to the top and left values of hte div but for some reason it is not working the div is still placed at the top of the page

 

function stateChanged() 
{ 
if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete")
{
if (window.innerWidth){
var xpos = window.innerWidth/2;
var ypos = (window.innerHeight/2)+window.pageYOffset;
}
if (document.all){
var xpos =  document.body.clientWidth/2;
var ypos =  (document.body.clientHeight/2)+document.body.scrollTop;
}
xpos = xpos - (document.getElementById("viewer").style.width/2);
//xpos = xpos - (document.getElementById("viewer").style.width/2);
document.getElementById("viewer").style.left=xpos+"px";
document.getElementById("viewer").style.top=ypos+"px";
document.getElementById("viewer").innerHTML=xmlHttp.responseText 
} 
}