Loading:

Mikołajkowa promocja 3za2 - w tym roku przygotuj większą skarpetę!

Dymek z podpowiedzią wyświetlany po najechaniu na warstwę

Skrypt wyświetla dymek z podpowiedzą po najechaniu myszką na warstwę div



Napisz Artykuł

Listing


<html>
    <head>
        <title>Tooltip - przykład</title>
        <script type="text/javascript">
            function showTip(oEvent) {
                var oDiv = document.getElementById("divTip1");
                oDiv.style.visibility = "visible";
                oDiv.style.left = oEvent.clientX + 5;
                oDiv.style.top = oEvent.clientY + 5;
            }

            function hideTip(oEvent) {
                var oDiv = document.getElementById("divTip1");
                oDiv.style.visibility = "hidden";
            }
        </script>
    </head>
    <body>
        <p>Umieść kursor myszy na czerwonym kwadracie.</p>
        <div id="div1"
             style="background-color: red; height: 50px; width: 50px"
             onmouseover="showTip(event)" onmouseout="hideTip(event)"></div>

         <div id="divTip1"
              style="background-color: yellow; position: absolute; visibility: hidden; padding: 5px">
            <span style="font-weight: bold">Własna podpowiedź</span><br />
            W tym miejscu można umieścić bardziej szczegółowe informacje.
         </div>
    </body>
</html>
 


Ten wpis posiada swój wątek na forum

Wszystkie pytania prosimy kierować właśnie tam ponieważ komentarze to miejsce na poprawki do kodu lub alternatywne rozwiązania i pytania nie będą publikowane

http://forum.funkcje.net/forum/viewtopic.php?f=2&t=3331

Dane do logowania na forum są takie same jak na funkcje.net



Dodano przez: igor
Ranga: Administrator serwisu Punktów: 28716
Komentarze użytkowników
Jak taki dymek można pokolorować?
autor: jurek123 | 12616 | 2011-10-25 22:24:52


    • Treść komentarza
      Kod do komentarza (opcjonalnie)
      PHP JavaScript MySQL Smarty SQL HTML CSS ActionScript
      Autor
      Token
      token

       

       








funkcje.net
Wszelkie prawa zastrzeżone©. | Funkcje.net 2008-17 v.1.5 | design: diviXdesign & rainbowcolors