B
babszem
Guest
Hi everyone! First of all sorry for not posting the thing below as a link, but unfortunately I don't have access to a handy website right now to upload it there.
My problem is that the html page and script below works on every browser I could put my hands on right now (that doesn't mean all of them of course, but quite some - IE, Mozilla, Opera...), except on Safari. I cannot figure out what could be the problem, because a lot of googling on the net turned up this findPos script as a fail-safe one that would work on all browsers. Safari seems to ignore this however...
Please could anyone:
1. Confirm my problem (see the contents of the layer).
2. Suggest any alternative to getting the correct position in Safari.
Thanks a lot:
Babszem.
<html>
<head>
<title>Safari Javascript bug testcase</title>
<script type="text/javascript">
function findPosX(obj)
{
var curleft = 0;
if (obj.offsetParent)
{
while (obj.offsetParent)
{
curleft += obj.offsetLeft
obj = obj.offsetParent;
}
}
else if (obj.x)
curleft += obj.x;
return curleft;
}
function findPosY(obj)
{
var curtop = 0;
if (obj.offsetParent)
{
while (obj.offsetParent)
{
curtop += obj.offsetTop
obj = obj.offsetParent;
}
}
else if (obj.y)
curtop += obj.y;
return curtop;
}
function testfunction ()
{
leftPos = findPosX (document.getElementById('testcell'));
topPos = findPosY (document.getElementById('testcell'));
document.getElementById('testlayer').style.left = leftPos;
document.getElementById('testlayer').style.top = topPos;
}
window.onload = testfunction;
</script>
</head>
<body>
<table border="1px" width="100%">
<tr>
<td width="40%">
<span style="font-size:xx-large;">Header</span>
</td>
<td>
Logo goes here
</td>
</tr>
<tr>
<td id="testcell" colspan="2" height="500px">
<div id="testlayer" style="position
bsolute; left:0px; top:0px; width:500px; height:200px; z-index=10; background-color:#8888FF;">
Layer should start in
<ul>
<li>upper left corner of Content cell</li>
</ul>
Position is
<ul>
<li>partly outside and vertically in the middle of the cell</li>
</ul>
Conclusion: <code>findPos ()</code> functions only return position of "Content" text relative to table upper left corner. (I asked for content <u>cell</u>.) Why?
</div>
Content
</td>
</tr>
</table>
</body>
</html>
My problem is that the html page and script below works on every browser I could put my hands on right now (that doesn't mean all of them of course, but quite some - IE, Mozilla, Opera...), except on Safari. I cannot figure out what could be the problem, because a lot of googling on the net turned up this findPos script as a fail-safe one that would work on all browsers. Safari seems to ignore this however...
Please could anyone:
1. Confirm my problem (see the contents of the layer).
2. Suggest any alternative to getting the correct position in Safari.
Thanks a lot:
Babszem.
<html>
<head>
<title>Safari Javascript bug testcase</title>
<script type="text/javascript">
function findPosX(obj)
{
var curleft = 0;
if (obj.offsetParent)
{
while (obj.offsetParent)
{
curleft += obj.offsetLeft
obj = obj.offsetParent;
}
}
else if (obj.x)
curleft += obj.x;
return curleft;
}
function findPosY(obj)
{
var curtop = 0;
if (obj.offsetParent)
{
while (obj.offsetParent)
{
curtop += obj.offsetTop
obj = obj.offsetParent;
}
}
else if (obj.y)
curtop += obj.y;
return curtop;
}
function testfunction ()
{
leftPos = findPosX (document.getElementById('testcell'));
topPos = findPosY (document.getElementById('testcell'));
document.getElementById('testlayer').style.left = leftPos;
document.getElementById('testlayer').style.top = topPos;
}
window.onload = testfunction;
</script>
</head>
<body>
<table border="1px" width="100%">
<tr>
<td width="40%">
<span style="font-size:xx-large;">Header</span>
</td>
<td>
Logo goes here
</td>
</tr>
<tr>
<td id="testcell" colspan="2" height="500px">
<div id="testlayer" style="position
bsolute; left:0px; top:0px; width:500px; height:200px; z-index=10; background-color:#8888FF;">Layer should start in
<ul>
<li>upper left corner of Content cell</li>
</ul>
Position is
<ul>
<li>partly outside and vertically in the middle of the cell</li>
</ul>
Conclusion: <code>findPos ()</code> functions only return position of "Content" text relative to table upper left corner. (I asked for content <u>cell</u>.) Why?
</div>
Content
</td>
</tr>
</table>
</body>
</html>
