MartinP: Infobox mit Mouseover

Hallo,

ich habe das Infobox-Beispiel unter:

http://aktuell.de.selfhtml.org/artikel/css/infobox/

ausprobiert.

Generell gefällt mir die Geschichte ganz gut.

Allerdings kommt bei mir nur das 2. Beispiel in Frage.

Beispiel 1 und 3 funktionieren nicht mit dem IE.

Liegt wahrscheinlich daran, dass der IE nur A-Tags mit dem hover Effekt erkennt und keine anderen Tags wie  zum Beispiel DIV.

Jetzt habe ich allerdings ein Problem...

Und zwar möchte ich, wie gesagt, Beispiel 2 verwenden.
Allerdings hätte ich gerne innerhalb von der Infobox noch einen weiteren Link. Dazu müsste ich das Beispiel von:

<div id="box"><a href="#">INFOBOX<span>Lorem ipsum dolor sit amet.</span></a></div>

in

<div id="box"><a href="#">INFOBOX<span>Lorem ipsum <a href="#">dolor</a> sit amet.</span></a></div>

ändern.

Allerdings funktioniert dies nicht, auch wenn ich mit CSS zwei verschiedene A-Klassen mache.

In diesem Fall wird nämlich die Definition:
#box a span {display:none;}

nach dem zweiten <a> aufgehoben.

Ich vermute es liegt daran, dass man Links nicht verschachteln kann.

Hat jemand von Euch eine andere Idee wie ich das lösen kann?

Bye,
Martin

  1. Hi,

    Ich vermute es liegt daran, dass man Links nicht verschachteln kann.

    Richtig vermutet ;)

    Wie wäre es hiermit?:

    <div id="box"><a href="#" class="hide">INFOBOX<span>Lorem ipsum</span></a><a href="#" class="show"><span>dolor</span></a><a href="#" class="hide"><span> sit amet.</span></a></div>

    gruß
    ingo

    1. <div id="box"><a href="#" class="hide">INFOBOX<span>Lorem ipsum</span></a><a href="#" class="show"><span>dolor</span></a><a href="#" class="hide"><span> sit amet.</span></a></div>

      Was heisst denn bei Dir class="show"?

      Das "dolor" IMMER angezeigt wird?

      Das soll es gerade nicht. Es soll nur das Wort INFOBOX immer angezeigt werden und bei Mouseover dann der Rest.

      Mein Problem ist ja gerade, dass die A-Tags und alles was darauf folgt immer angezeigt wird, auch wenn es eigentlich nur bei Mouseover(hover) angezeigt werden sollte.

      Bye,
      Martin