Entfernung
Aleksej V.
- javascript
Hallo,
kurze frage,
wie lese die entfernung eines elements zum linken rand der seite aus?
Danke, Aleksej
Hallo,
wie lese die entfernung eines elements zum linken rand der seite aus?
object.offsetLeft
z. B. document.getElementById("elementid").offsetLeft
MfG, Thomas
kurze frage,
wie lese die entfernung eines elements zum linken rand der seite aus?
Hallo!
Mit element.offsetLeft.
Wird allerdings von den Browsern unterschiedlich interpretiert, nämlich teils direkt als Abstand zum Dokumentrand, teils als Abstand zum nächsten Elternelement.
Das Problem kann man umgehen, indem man einfach offsetLeft solange iterativ addiert, bis es kein Elternelement mehr gibt.
Beispiel (dürfte in Gecko, Opera ab 5, Konqueror 3 (wahrsch. auch 2), IE ab 4 funzen):
<html>
<head>
<script language="JavaScript" type="text/javascript">
<!--
function getOffset(id)
{
var d,el,u,x=0,y=0;
if((el=((d=document).getElementById?d.getElementById(id):null))&&typeof el.offsetLeft!=(u="undefined")&&typeof el.offsetParent!=u)
{
while (el)
{
x+=parseInt(el.offsetLeft);
y+=parseInt(el.offsetTop);
el=el.offsetParent;
}
alert("Offset X = "+x+", Offset Y = "+y);
}
}
//-->
</script>
</head>
<body>
<center>
<span id="t" onclick="getOffset(this.id)">Auf Elemente dieser Seite klicken...</span>
</center>
<table>
<tr>
<td>
<span style="background:#cccccc;" id="s" onclick="getOffset(this.id)">Ein span in einer table</span>
</td>
</tr>
<tr>
<td width="600" align="right" bgcolor="#cccccc">
<table>
<tr>
<td>
<a id="a" href="#" onclick="getOffset(this.id);return false;">und ein <a> in einer verschachtelten table</a>
</td>
</tr>
</table>
</td>
</tr>
</table>
<p id="p" onclick="getOffset(this.id)">
Hier ein <p>
</p>
<center><img border="2" id="i" src="notExistent.gif" width="100" height="100" alt="image" onclick="getOffset(this.id)"></center>
</body>
</html>
NN4: Liefert den Abstand zum Dokumentrand (oder, falls in Layer, zum Layerrand) für folgende Elemente:
document.images[..].x
document.links[..].x
und für layer/div den Abstand zum Elternlayer-/Documentrand als
document.layers[..].left
Grüße
Walter
Jö, Danke für den tollen Script!
Grüße aus Düsseldorf
Aleksej