nitramx: onMouseover - wenn maus über div x, dann ausgabe in div y?

Hallo

Ich möchte auf einer Seite eine Infobox einrichten.
Diese soll Inhalt anzeigen, sobald der Benutzer die Maus über den Bereich (div) fährt, über den er Information erhalten will.

Ich bin jetzt auf onMouseover gekommen, weiß aber nicht wie ich es realisieren soll (Anfänger)

Wäre super, wenn mir geholfen werden könnte.

mfg
Martin

  1. Hi,

    Ich möchte auf einer Seite eine Infobox einrichten.
    Diese soll Inhalt anzeigen, sobald der Benutzer die Maus über den Bereich (div) fährt, über den er Information erhalten will.

    Ich bin jetzt auf onMouseover gekommen, weiß aber nicht wie ich es realisieren soll (Anfänger)

    Das geht auch ohne Javascript und zwar mit CSS. Bei Selfhtml gibt es einen Artikel dazu.

    mfG,
    steckl

    1. Hi,

      Ich möchte auf einer Seite eine Infobox einrichten.
      Diese soll Inhalt anzeigen, sobald der Benutzer die Maus über den Bereich (div) fährt, über den er Information erhalten will.

      Ich bin jetzt auf onMouseover gekommen, weiß aber nicht wie ich es realisieren soll (Anfänger)

      Das geht auch ohne Javascript und zwar mit CSS. Bei Selfhtml gibt es einen Artikel dazu.

      mfG,
      steckl

      das reicht mir leider nicht aus. Ich möchte eine INfobox, in die ich auch Links setzen kann - die also nicht gleich verschwindet, wenn man den Zeiger wegbewegt.

      1. Hi,

        das reicht mir leider nicht aus. Ich möchte eine INfobox, in die ich auch Links setzen kann - die also nicht gleich verschwindet, wenn man den Zeiger wegbewegt.

        Soll darin immer der gleiche Text angezeigt werden?

        Am einfachsten waere es, wenn du die CSS-Eigenschaft display oder visibility so mit JS veraenderst, dass die Box ein- bzw. ausgeblendet wird.

        Wenn du mehrere Boxen hast kannst du ja alle auf unsichtbar setzen und dann die von dir gewuenschte anzeigen lassen.

        Geht dann in etwa so:

        document.getElementById('BOX_DIE_VERSTELLT_WERDEN_SOLL').style.display = 'GEWUENSCHTER_WERT';

        mfG,
        steckl

        1. Hi,

          das reicht mir leider nicht aus. Ich möchte eine INfobox, in die ich auch Links setzen kann - die also nicht gleich verschwindet, wenn man den Zeiger wegbewegt.

          Soll darin immer der gleiche Text angezeigt werden?

          Am einfachsten waere es, wenn du die CSS-Eigenschaft display oder visibility so mit JS veraenderst, dass die Box ein- bzw. ausgeblendet wird.

          Wenn du mehrere Boxen hast kannst du ja alle auf unsichtbar setzen und dann die von dir gewuenschte anzeigen lassen.

          Geht dann in etwa so:

          document.getElementById('BOX_DIE_VERSTELLT_WERDEN_SOLL').style.display = 'GEWUENSCHTER_WERT';

          mfG,
          steckl

          Danke für den Anstoß! Hat mir geholfen. Habe das mit deinem Lösungsvorschlag erst mal so gelöst:

          <script type="text/javascript">
          function nitram_an() {
          document.getElementById("nitram_box").style.visibility = "visible"; }
          function nitram_aus() {
          document.getElementById("nitram_box").style.visibility = "hidden"; }
          </script>
          .
          .
          .
          <div class="nitram" onMouseover="nitram_an()"></div>
            <div id="nitram_box" onMouseout="nitram_aus()">
            <h1 style="margin:30px 30px 0 30px;"><br />WTF!</h1>
            <p style="margin:0 33px 30px 30px;">Nitram-X on the Moon!</p>
            </div>