wanda111: superschnelle ALT-Text-Anzeige gewünscht

Leider habe ich trotz Suche im Forum keinen entsprechenden Lösungsbeitrag zu meinem Problem gefunden. Deshalb hier meine Frage:

Ich würde gerne, wenn man mit der Maus über einen bestimmten Teil einer Grafik fährt, einen vorgegebenen Text angezeigt bekommen.
Dies funktioniert derzeit so:

<div>
<map name="Landkarte" id="Landkarte">
<area shape="rect" coords="10,10,60,50" href="http://www.koblenz.de/" alt="Koblenz">
</map>
</div>

Die Anzeige "Koblenz" erscheint aber vieeeellll zu langsam.
Wie ist es realisierbar, dass der Text innerhalb von Sekundenbruchteilen angezeigt wird?

Für Hilfe wäre ich sehr, sehr dankbar.

  1. Ich habe Dir keinen konkreten Code an der Hand, jedoch musste das mit Javascript lösen. Dabei rufst du mit dem Überfahren der Karte eine Funktion auf, die ein Div an der Stelle deines Mauszeigers anzeigt.

    Viel Spaß beim Suchen (hab in den ersten paar google-Ausgaben, nichts konkretes gefunden)

  2. Moin,

    <area shape="rect" coords="10,10,60,50" href="http://www.koblenz.de/" alt="Koblenz">

    Die Anzeige "Koblenz" erscheint aber vieeeellll zu langsam.

    Der Alt-Text soll, wie der Name schon sagt, eine Alternativdarstellung sein, falls das Bild nicht angezeigt werden kann. Für zusätzliche Beschreibungen gibt es das title-Attribut, was in den meisten grafischen Browsern als Tooltip dargestellt wird. Mir ist nur ein einziger Browser bekannt, der den Alt-Text in einem Tooltip darstellt.

    Für die sofortige Anzeige geht es entweder mit reinem CSS, mittels :hover, was ein weit verbreiteter Browser bis zur Version 6 zumindest allerdings nur bei Links unterstützt. Oder du mixt noch eine Prise JavaScript hinzu, dann geht es auch dort, sollte JavaScript aktiviert sein.

    Tschau,
    Martin

    1. Moin!

      Für die sofortige Anzeige geht es entweder mit reinem CSS, mittels :hover, was ein weit verbreiteter Browser bis zur Version 6 zumindest allerdings nur bei Links unterstützt.

      Würdest du das bitte mal anhand eines Beispiels dokumentieren?

      - Sven Rautenberg

      --
      My sssignature, my preciousssss!
      1. Hi,

        Für die sofortige Anzeige geht es entweder mit reinem CSS, mittels :hover, was ein weit verbreiteter Browser bis zur Version 6 zumindest allerdings nur bei Links unterstützt.

        Würdest du das bitte mal anhand eines Beispiels dokumentieren?

        Ungetestet, mal so aus dem hohlen Bauch raus:

        <area id="bla" coords="1,2,3,4" shape="rect"><span>text</span>

        #bla+span { display:none; }
        #bla:hover+span { display:block; }

        Alternativ:

        <a id="bla" coords="1,2,3,4" shape="rect"><span>text</span></a>

        #bla span { display:none; }
        #bla:hover span { display:block; }

        ggf. noch mit Positionierung usw. versehen.

        cu,
        Andreas

        --
        Warum nennt sich Andreas hier MudGuard?
        Schreinerei Waechter
        O o ostern ...
        Fachfragen unaufgefordert per E-Mail halte ich für unverschämt und werde entsprechende E-Mails nicht beantworten. Für Fachfragen ist das Forum da.
        1. Moin!

          Für die sofortige Anzeige geht es entweder mit reinem CSS, mittels :hover, was ein weit verbreiteter Browser bis zur Version 6 zumindest allerdings nur bei Links unterstützt.

          Würdest du das bitte mal anhand eines Beispiels dokumentieren?

          Ungetestet, mal so aus dem hohlen Bauch raus:

          <area id="bla" coords="1,2,3,4" shape="rect"><span>text</span>

          Das funzt ja schon nicht, weil innerhalb von <map> nichts außer <area> erlaubt ist!

          Abgesehen davon funktioniert das natürlich nicht im IE.

          Alternativ:

          <a id="bla" coords="1,2,3,4" shape="rect"><span>text</span></a>

          #bla span { display:none; }
          #bla:hover span { display:block; }

          ggf. noch mit Positionierung usw. versehen.

          Das ist aber keine Imagemap mehr. Und das Attribut "shape" und "coords" existiert für das Element <a> auch nicht.

          - Sven Rautenberg

          --
          My sssignature, my preciousssss!
          1. Hi,

            Das funzt ja schon nicht, weil innerhalb von <map> nichts außer <area> erlaubt ist!

            Sagt wer?
            http://www.w3.org/TR/html4/struct/objects.html#edef-MAP erlaubt ganz eindeutig mehr als nur area-Elemente, nämlich block-Elemente.

            <a id="bla" coords="1,2,3,4" shape="rect"><span>text</span></a>
            Das ist aber keine Imagemap mehr. Und das Attribut "shape" und "coords" existiert für das Element <a> auch nicht.

            Sagt wer?
            http://www.w3.org/TR/html4/struct/links.html#edef-A definiert sowohl shape als auch coords für das a-Element.

            cu,
            Andreas

            --
            Warum nennt sich Andreas hier MudGuard?
            Schreinerei Waechter
            O o ostern ...
            Fachfragen unaufgefordert per E-Mail halte ich für unverschämt und werde entsprechende E-Mails nicht beantworten. Für Fachfragen ist das Forum da.
  3. Hallo wanda111.

    Wie ist es realisierbar, dass der Text innerhalb von Sekundenbruchteilen angezeigt wird?

    Mit der Infobox beispielsweise.

    Einen schönen Montag noch.

    Gruß, Ashura

    --
    sh:( fo:} ch:? rl:( br: n4:~ ie:{ mo:| va:) de:> zu:} fl:( ss:) ls:[ js:|
    mathbr:del.icio.us/ mathbr:w00t/