Vinzenz Mai: Endnoten als tooltip

Beitrag lesen

Hallo Ingrid,

Du hast nicht weit genug gedacht. Es kann ja mehrere Verweise auf die gleiche Endnote geben. Ersetze daher id durch class, die Klasse "endnote" sollte ausreichen.

nehmen wir mal folgendes Markup an:

  
<!-- Normaler Text der Seite -->  
[...] irgendwelcher Text<sup class="endnote"><a href="#endnote-1">[1]</a></sup>  
[...] noch weiterer Text<sup class="endnote"><a href="#endnote-2">[2]</a></sup>  
[...] nochmals Verweis auf Endnote 1<sup class="endnote"><a href="#endnote-1">[1]</a></sup>  
[...]  
  
<!-- Endnotenbereich -->  
<p id="endnote-1">Endnote zu [1]</p>  
<p id="endnote-2">Endnote zu [2]</p>  
[...]  

Wenn Du das mit Javascript lösen willst, so brauchst Du bei mouseover über dem Verweis zur Endnote vom Wert der id des sup-Elementes den Textanteil "verweis-" streichen und das p-Element mit dieser id (oder ein Klon davon) an der von Dir gewünschten Stelle anzeigen.

Es wird nur ein wenig komplizierter: Suche im Element, das gehovert wird, den Inhalt des Textknotens, der in den eckigen Klammern steht. Ermittle somit die id des p-Elementes, das Du als Infobox anzeigen willst.

Freundliche Grüße

Vinzenz