Je ne sais pas pourquoi cela fait cela. Chaque fois que vous ajoutez une propriété au :first-letter
Classe PSUedo, l'animation ne fonctionnera plus.
La :first-letter
La classe PSUedo semble annuler le volant précédent.
Comme vous pouvez le voir chaque fois que la classe PSUedo est active, elle annulera tout précédent: survolera (la transition dans ce cas).
Donc, dans votre cas, je n'exécute même pas votre animation
Je ne sais pas pourquoi cela se produit, cela semble être un nouveau bug de Big précédent:
:first-letter
La classe PSUedo ne fonctionne pas lorsqu'elle est suivie d'une classe ou d'une pseudo-classe (par exemple div: premier lettre: en survol).
Il semble que ce soit l'inverse maintenant?
La théorie est que lorsque le pervers, il y a une pseudo-classe avant le :first-letter
Cela ne fonctionnera pas. Il se peut qu'un :hover
La pseudo-classe n'est pas considérée comme "contenu généré".
Lorsque les pseudo-éléments de première lettre et: de première ligne sont appliqués à un élément ayant du contenu généré en utilisant: avant et: après, ils s'appliquent à la première lettre ou à la ligne de l'élément, y compris le Contenu généré.
la source : http://www.w3.org/tr/css2/selector.html#before-and-after
De cette façon le :hover
n'est pas montré.
J'ai regardé plusieurs documentations et je n'ai pas trouvé autre Relation entre l'animation, les images clés, la transmission, la classe PSUedo de première lettre. L'explique entre la classe de puredo de survol et la classe psudo de première lettre qui pourrait ne pas interagir les uns avec les autres dans IE.
Tl; dr
C'est probablement un bug.
Ton :first-letter
La classe PSUedo ne fonctionne pas avec le :hover
Classe PSUedo de l'élément parent. la :hover
Classe PSUedo qui ne sera pas montrée, donc votre animation n'est pas chargée.
Solution de contournement
Vous pouvez simplement placer le contenu directement dans votre HTML et envelopper la première lettre en une durée:
<div style="width:160px;height:300px;float:right;">
<a href="kapcsolat.html" class="animated menu5">
<span>K</span>apcsolat
</a>
</div>
Où vous ajoutez un style lorsque l'ancre est planée:
.menu5:hover > span
{
color: black;
}