Felix Riesterer: /JAVASCRIPT - Erläuterungs-Fenster

Beitrag lesen

Lieber Jörg,

da sehe ich zwei Lösungen:

1.) mit CSS (wie bei Ingos Infobox)
2.) mit Javascript (wie bei meinem GB-Hinweis)

Zur ersten Vorgehensweise findest Du ja eine Anleitung auf Ingos Seite. Zur zweiten Vorgehensweise poste ich hier meinen relevanten Code:

    <p id="ip-logging-hinweis">Aus Sicherheitsgr&uuml;nden wird zu Ihrem Eintrag auch Ihre IP mitgespeichert.  
        <span>Aus der Kombination von Zeitpunkt und IP kann bei Ihrem Internet-Provider Ihre Identit&auml;t ermittelt werden. Zugang zu diesen Daten hat aber nur eine Staatsanwaltschaft.</span>  
    </p>  
    <!-- folgendes Script sucht nach dem obigen Absatz -->  
    <script type="text/javascript">
~~~~~~javascript
  
        (  
            function () {  
                var hinweis = document.getElementById("ip-logging-hinweis");  
                var show = document.createElement("a");  
                show.href = "#";  
                show.innerHTML = "(Was bedeutet das?)";  
                show.onmouseover = function () {  
                    this.nextSibling.style.display = "block";  
                };  
                show.onmouseout =  function () {  
                    this.nextSibling.style.display = "none";  
                };  
  
                if (hinweis) {  
                    hinweis = hinweis.getElementsByTagName("span")[0];  
                    hinweis.style.position = "absolute";  
                    hinweis.style.width = "200px";  
                    hinweis.style.border = "1px solid red";  
                    hinweis.style.background = "white";  
                    hinweis.style.padding = "15px";  
                    hinweis.style.display = "none";  
                    hinweis.parentNode.insertBefore(show, hinweis);  
                }  
            } ()  
        )  
    
~~~`</script>`{:.language-html}  
  
Diese Vorgehensweise "funktioniert" auch bei ausgeschaltetem Javascript. Das <span>-Element wird ohne Javascript ganz einfach angezeigt, mit Javascript wird es unsichtbar geschaltet. Um es sichtbar schalten zu können, wird per Javascript ein Link eingefügt, der beim Überfahren mit der Maus das <span>-Element sichtbar schaltet.  
  
Liebe Grüße aus [Ellwangen](http://www.ellwangen.de/),  
  
Felix Riesterer.

-- 
ie:% br:> fl:| va:) ls:[ fo:) rl:° n4:? de:> ss:| ch:? js:) mo:} zu:)