IE Problem: Transparentes Div über einem Bild löst kein CSS aus: hover

Question

Sep 22, 2010, 07:00 PM

hover internet-explorer html transparent

IE Problem: Transparentes Div über einem Bild löst kein CSS aus: hover

Hier ist das Problem: Ich möchte mit transparentem div reaktive Zonen auf einem Bild erstellen, aber der folgende Code funktioniert nicht im Internet Explorer (auf Chrome getestet): Die Hintergrundfarbe des div "hover_zone" ändert sich bei nicht alle

Das Problem liegt daran, dass die Hintergrundfarbe auf transparent eingestellt ist. Verwenden Sie eine gültige Farbe wie #FFF und es funktioniert (es scheint, als würde der IE so denken: Es ist transparent, es enthält nichts, lasst es uns nicht anzeigen).

<html>
<body>

<style type='text/css'>

#hover_zone{
    background-color:transparent;
    visibility: visible;
    position:absolute;
    width:40px;
    height:40px;
    left:10px;
    top:10px;
    z-index:1000;
}

a:hover #hover_zone{
    background-color:#0C0;
    visibility: visible;
}

</style> 

<div id="container">
  <img src="http://ptaff.ca/blogue/wp-content/uploads/noir_black.png" />
  <a href="#"><div id="hover_zone"></div></a>
</div>

</body>
</html>

Danke für Ihre Hilfe

Prost