Aleksej V.: Entfernung

Hallo,

kurze frage,

wie lese die entfernung eines elements zum linken rand der seite aus?

Danke, Aleksej

  1. Hallo,

    wie lese die entfernung eines elements zum linken rand der seite aus?

    object.offsetLeft
    z. B. document.getElementById("elementid").offsetLeft

    MfG, Thomas

  2. 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

    1. Jö, Danke für den tollen Script!

      Grüße aus Düsseldorf

      Aleksej