10
votes

Pourquoi IE10 nécessite-t-elle la présence d'une règle P: Hover {} pour les transitions pour travailler sur un pseudo-élément?

HTML:

p:hover {}


0 commentaires

3 Réponses :


2
votes

1 commentaires

Je peux confirmer ceci ( jsfiddle.net/sphzj/18 ). Ne répond pas à ma question cependant. Par conséquent, devrait être un commentaire, pas une réponse.



5
votes

semble être une régression

Cela semble être une régression légitime dans Internet Explorer 10. Comme indiqué sur MSDN , car Internet Explorer 7 utilisateurs ont été en mesure de cibler l'état de navigation de tout élément em> et non seulement a code>. p>

curieusement j'ai essayé le : actif code> pseudo-classe, et cela semble fonctionner comme prévu. En outre, il s'agit d'une régression, vous pouvez voir que, en modifiant ceci en un élément A code>, la transition se déroule comme prévu (puisque historiquement, a code> et : survoler code> aller à la main). p>

Vêtements de travail en option h3>

Il n'y a que quelques solutions que je peux penser à ce stade (en attendant ce être corrigé): p>

  1. Utilisez le vide vide p: hover {} code> correction. li>
  2. Modifiez votre balisage à la cible :: après code> sur un enfant du p code>. li>
  3. Modifiez le sélecteur pour utiliser des combinaisons. LI> ol>

    Le premier élément est celui que vous avez spécifié dans votre question et est très attrayant compte tenu de sa simplicité. En fait, vous pouvez utiliser : hover {} code> et obtenir les mêmes résultats ( probablement la meilleure solution ). p>

    Le deuxième élément est également DO-capable em>, mais un peu moins souhaitable car il nécessite une modification Le balisage, qui n'est pas toujours possible et d'être franc, un peu stupide. p>

    La dernière option est quelque peu intéressante. Si vous modifiez le sélecteur pour être basé sur des relations de frère de soeur, il commence par magiquement à travailler à nouveau. Par exemple, supposons que nous ayons plusieurs éléments dans le corps: p> xxx pré>

    Nous pouvons maintenant utiliser des combinaisons pour cibler le deuxième paragraphe: p> xxx pré>

    Ce sélecteur correspondra à n'importe quel paragraphe après un paragraphe, ce qui n'est pas souhaitable. À ce stade, nous pourrions envisager : nième enfant cod> ou : nième type code> pour spécifier en outre quel paragraphe que nous voulons, même en utilisant la combinaison générale de la soeur: p >

    *~.hoverme:hover::after {} /* Targets <p class="hoverme"> among siblings */
    


3 commentaires

P + P: Hover :: Après fonctionne effectivement ( jsfiddle.net/sphzj/ 21 ). Cela devient rediguleux -.-


@ Šimevidas C'est la façon dont l'industrie fonctionne; Vous ne pouviez même pas animer des pseudo-éléments en chrome jusqu'à la version 26. C'était une toute autre gêne depuis de nombreuses années :) En ce qui concerne IE, vous pouvez également utiliser le sélecteur universel * ~ .ClassName: Vercher :: Après pour saisir l'élément cible.


Non seulement cela est corrigé dans IE11, mais apparemment, il ne peut pas être reproduit dans l'émulation MSHTML10 de l'IE11.



0
votes

Ce même phénomène est apparu lorsque j'ai essayé d'ajouter une règle pour changer le curseur en un pointeur. Toutefois,

cursor: pointer;


0 commentaires