CSS-Popups, z-index Problem gelöst, IE will immer noch nicht

[Detlef G.]

Hallo Shepard

Jetzt hab ich es! Ich habe den Linktext in <em></em> eingebettet und diesem einen z-index gegeben.

Ich hätte es wohl eher anders gemacht (alles nur schnell zusammengeschrieben, also ungetestet und eventuell noch fehlerhaft):

    <a href="Ziel.htm">  
      <span><img src="Thumbnailgrafik.jpg" alt="...">  
      Linktext</span>  
      <img src="Das-Bild-mittelgross.jpg" alt="...">  
    </a>  

Dann im CSS:

  
/* nicht sichtbares, mittelgroßes Bild */  
#bildmenu li a img {  
  width:0;  
  height:0;  
  border-width:0;  
}  
  
/* beim Hovern eingeblendetes, mittelgroßes Bild */  
#bildmenu li a:hover img {  
  position:absolute;  
  top:-10px; left:-610px; width:620px; height:410px;  
  z-index:0;  
}  
  
/* Thumbnailgrafik und Linktext: */  
#bildmenu li a span {  
 position:relative; top:0; z-index:10;  
}  
  
/* Die Thumbnailgrafik (eventuell ist zzusätzlich noch ", #bildmenu li a:hover span img" nötig): */  
#bildmenu li a span img {  
  width:120px;  
  height:79px;  
  position:static;  
}  

Bleibt nur noch: Warum funktioniert das Popup nicht im IE?

Wie ich bereits schrieb, ignoriert der IE Änderungen eines Kindelements beim hovern, wenn er nicht dazu gebracht wird, sich die Sache noch einmal zu überlegen. Dazu ist es erforderlich, eine Eigenschaft des Links selbst zu ändern, auch wenn diese Änderung nicht zu sehen ist.

Eventuell reicht bereits:

/* der Link selbst */  
#bildmenu li a {  
  background-color:#ffffff;  
}  
  
#bildmenu li a:hover {  
  background-color:#fff;  
}  

Auf Wiederlesen
Detlef