IE8: Div Hover ne fonctionne que lorsque la couleur de fond est définie, très étrange, pourquoi?

Situation: Ai un div avec des boutons, des images. Div besoins de fadeIn sur le vol stationnaire. Fonctionne dans tous les navigateurs, sauf Internet Explorer. Quand je donne le div d'une couleur d'arrière-plan soudain, elle fonctionne.

Vérifier: http://ListAndPlay.com , en haut à gauche sont les contrôles.

Le hover ne fonctionne pas dans IE, essayez d'ajouter une couleur d'arrière-plan #boutons et soudain, elle fonctionne.

Question: Quelle est la raison? Comment réparer cela?

source d'informationauteur MeProtozoan

  1. 26

    J'ai récemment rencontré ce problème également. J'ai aussi résolu par l'ajout d'un 1 par 1 px image de fond transparente à l'passez la souris sur l'élément. J'ai envie de prendre une douche après.

  2. 10

    J'ai eu ce problème il suffit aujourd'hui de faire un transparent superposition div apparaître lors de son survol. IE9 ne pas activer passez la souris jusqu'à ce que la souris était sur le contenu du texte de la superposition. A bien fonctionné sur Chrome et FF4. Je n'ai pas essayer de l'image transparente de solution de contournement, mais cela semblait fonctionner parfaitement: rgba(0,0,0,0). Bizarre...

  3. 5

    Ma solution est de mettre une couleur de fond sur l'élément que vous avez besoin de planer, puis utiliser le CSS opacity propriété de le cacher. Une solution de repli est prévue c'est à dire dans la forme d'un filtre.

    .element {
  background-color: #fff;
  opacity: 0;
  filter: alpha(opacity=1);
}

    Cette solution ne nécessite pas une image PNG transparente, et à la différence de la rgba la solution, il travaille dans les anciennes versions d'IE.

  4. 2

    Cela est dû à a disposition. À l'aide de position:relative donnent le même résultat sans utiliser de fond indésirable de l'image.

  5. 2

    J'ai rencontré le même problème. Pour moi, le problème semblait être liés à l'utilisation des éléments html5 (par exemple <footer> et header) dans ie8, et oublier d'utiliser html5shiv pour ajouter le support de ces éléments pour les anciens navigateurs.

    Dans ce cas, l'ajout de la html5shiv résolu le problème. Aucune des solutions proposées n'avait aucun effet.

  6. 2

    J'ai eu le même problème avec IE8, à l'aide de HTML5. Ma solution a été inspiré par Herman. J'ai mis une image de fond et puis je suis en création d'arrière-plan de la non-existence d'une partie. En gros, je demande au navigateur d'afficher quelque chose qui est au-delà de l'image dimensions.

    background: url(myimage.png) 300px 0px no-repeat;

    Pour éviter le trafic, il peut être site web du sprite ou de toute autre image valide qu'il est déjà utilisé sur la page.

  7. 1

    Même avec la dernière version d'IE9, j'ai ce même problème. Comme MeProtozoan suggéré, l'ajout d'un arrière-plan transparent de l'image de l'ancre(s) obtient le comportement de travail comme vous le souhaitez, mais sacrément elle est sale.

  8. 0

    J'ai eu le même problème avec flotter dans les div ne fonctionne pas avec IE8 et changer mon doctype 

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

    fixe.

    Plus de détails ici