[Javascript] DOCTYPE making div.style.top NOT WORK
Michael Borchers
list at tridemail.de
Thu Dec 14 06:49:34 CST 2006
the following script works fine so far!
but when adding the following DOCTYPE into the first line:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
the script stops working and div.style.top seems to have no effect.
it took me a lot of time to find this. any reason?!
thanks
the script:
---------------------------------------------------------------------------------------------------------------------
<html>
<head>
<title>JavaScript</title>
<script type="text/javascript">
function getPosition(element)
{
var elem=element,tagname="",x=0,y=0;
while ((typeof(elem)=="object")&&(typeof(elem.tagName)!="undefined"))
{
y+=elem.offsetTop;
x+=elem.offsetLeft;
tagname=elem.tagName.toUpperCase();
if (tagname=="BODY")
elem=0;
if (typeof(elem)=="object")
if (typeof(elem.offsetParent)=="object")
elem=elem.offsetParent;
}
position=new Object();
position.x=x;
position.y=y;
return position;
}
function getSort(elementId, divId, show)
{
var a,element;
element=document.getElementById(elementId);
div=document.getElementById(divId);
a=getPosition(element);
if(show == true)
{
div.style.visibility = 'visible';
div.style.display = 'block';
div.style.top = a.x+58;
div.style.left = a.y+20;
}
else
{
div.style.visibility = 'hidden';
div.style.display = 'none';
}
}
function handleSort(elementId, divId, show)
{
var a,element;
element=document.getElementById(elementId);
div=document.getElementById(divId);
a=getPosition(element);
if(show == true)
{
div.style.top = a.x+58;
div.style.left = a.y+20;
div.style.visibility = 'visible';
div.style.display = 'block';
}
else
{
div.style.visibility = 'hidden';
div.style.display = 'none';
}
}
</script>
</head>
<body>
<a onmouseover="javascript:handleSort(this.id, 'sortDiv', true)"
name="sort[contacts.contacts_name]"
id="sort[contacts.contacts_name]">12345</a>
<div id="sortDiv"
style="display:none;visibility:hidden;position:relative;">test</div>
</body>
</html>
More information about the Javascript
mailing list