IE10 Hover + Pseudo Elements

问题

Example: http://codepen.io/mastastealth/pen/gFjhi

Basically, I have an element with an :after element set to opacity 0. On hover, it goes to opacity 1. Apparently it works in IE9 and everywhere else, but not IE10 (unless I click)? Ideas?

回答1:

It appears there is a bug where the selector with a pseudo class followed by a pseudo element is not listened for when an event happens. If you add the listener by simply adding the selector with only the pseudo class your style will be applied on the event occurring.

http://codepen.io/justinphillips/pen/qvHyi

.p:hover:after {
    opacity: 0.7;
  } 

.p:hover {}

回答2:

Apparently IE10 continues the horrible bug of not accepting :hover on divs. Example updated using an element instead and it works fine.

来源：https://stackoverflow.com/questions/14114526/ie10-hover-pseudo-elements