keksausmainz: Layer direkt unter Link öffnen lassen

Hallo und guten Morgen :-)

Ich suche eine Möglichkeit, die Postition eines Links auslesen zu lassen.

Der eigentliche Sinn ist, dass ein Layer direkt unter dem geklickten Link öffnen soll, denn leider ist eine feste Angabe nicht möglich (Seiten variieren, Link ist im <center> Tag -> schwierig, da eine feste Position zu geben :-))

Hat jemand eine Idee oder Lösung?
Eigentlich keine unlösbare Frage, aber ich steh irgendwie auf'm Schlauch ;-)

grüße aus mainz

  1. Hallo,

    Ich suche eine Möglichkeit, die Postition eines Links auslesen zu lassen.

    Hier https://forum.selfhtml.org/?t=120930&m=777033 hatte ich schon mal einen Hinweis auf zwei Feature-Artikel zu diesem Thema gepostet. Da diese aber noch mit document.all und document.layers arbeiten, habe ich mal schmell einen eigenen Vorschlag zusammengestellt:

      
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"  
            "http://www.w3.org/TR/html4/strict.dtd">  
    <html>  
    <head>  
    <title>Ermitteln absoluter Positionen mit JavaScript</title>  
    <meta http-equiv="content-type" content="text/html; charset=ISO-8859-1">  
    <script type="text/javascript">  
    <!--  
    function getAbsolutePosition(element){  
      /*Die Funktion erwartet ein HTMLElement als Parameter.  
        Sie erzeugt einen Point(0,0) und eine Referenz auf das HTML-Element.  
        Die x- und y-Koordinate des Points wird nun solange um die x- und y-Koordinaten  
        des linken oberen Eckpunktes der Elternelemente erhöht, bis das HTML-Element erreicht ist.  
        Dann sollte der Point die absoluten x- und y-Koordinaten des linken oberen Eckpunktes  
        des übergebenen Elements, bezogen auf das HTML-Element gespeichert haben.  
        Die Funktion gibt den Point oder im Fehlerfall false zurück.  
      */  
      try {  
        var absPosLeftTop = new Point();  
        var elementRoot = document.getElementsByTagName("html")[0];  
        while(element && element != elementRoot) {  
          absPosLeftTop.translate(element.offsetLeft, element.offsetTop);  
          element = element.offsetParent;  
        }  
        return absPosLeftTop;  
      } catch (e) {  
        alert(e); //zur Fehlerausgabe, sonst auskommentieren  
        return false;  
      }  
    }  
      
    function Point(x,y){  
      /*Ein Punkt-Objekt zum Speichern von x- und y-Koordinaten.  
        Eigenschaften:  
        .x = x-Koordinate als Ganzzahlwert  
        .y = y-Koordinate als Ganzzahlwert  
        Methoden:  
        .toString = Zeichenkettenpräsentation des Objektes mit x- und y-Koordinate  
        .translate = Koordinatenverschiebung um dx und dy, mit dx und dy als Ganzzahlwert  
      */  
      this.x = x || 0;  
      this.y = y || 0;  
      this.toString = function() {return 'Point('+this.x+', '+this.y+')';};  
      this.translate = function(dx, dy) {  
                this.x += dx || 0;  
                this.y += dy || 0;  
           };  
    }  
      
    //Das ist nur zum Testen. Es erfolgt keine Prüfung, ob die Funktionen zur Verfügung stehen!  
    //Für den praktischen Einsatz muss geprüft werden, ob document.getElementsByTagName existiert  
    //und ob getAbsolutePosition(this) einen Point oder false zurückgibt.  
    function init() {  
      var aElements = document.getElementsByTagName("a");  
      for (var i=0; i<aElements.length; i++) {  
        aElements[i].onclick = function() {alert(getAbsolutePosition(this).toString());};  
      }  
    }  
    //-->  
    </script>  
    </head>  
    <body onload="init();">  
    <h1>Ueberschrift</h1>  
    <p>Textabsatz</p>  
    <p>Textabsatz mit <a href="#">Link</a> und weiterm Text</p>  
    <p>Ein anderer Textabsatz mit einem <a href="#">Link</a> und weiterm Text</p>  
    <p style="text-align:center;">Ein zentrierter Textabsatz mit einem <a href="#">Link</a> und weiterm Text</p>  
    </body>  
    </html>  
    
    

    http://de.selfhtml.org/javascript/objekte/all.htm#offset_left
    http://de.selfhtml.org/javascript/objekte/all.htm#offset_top
    http://de.selfhtml.org/javascript/objekte/all.htm#offset_parent

    Bitte jeweils die Hinweise beachten. Das funktioniert nicht nur mit document.all, sondern auch mit HTMLElementen, die via document.getElement... ermittelt wurden.

    viele Grüße

    Axel