CSS - Transition ne fonctionne pas

Bonjour à tous, je suis en train d'essayer de faire une transition lorsque vous passez le fond devient violet et la couleur du texte s'allume en blanc.(à l'origine il n'y a pas de couleur d'arrière-plan et la couleur du texte est noir...)

Mais ce n'est pas de travail!

Qu'est-ce que Im faire de mal!?

a:hover {
    color: white;
    -webkit-transition: color 1000ms linear;
    -moz-transition: color 1000ms linear;
    -o-transition: color 1000ms linear;
    -ms-transition: color 1000ms linear;
    transition: color 1000ms linear;
    background-color: purple;
    -webkit-transition: background-color 1000ms linear;
    -moz-transition: background-color 1000ms linear;
    -o-transition: background-color 1000ms linear;
    -ms-transition: background-color 1000ms linear;
    transition: background-color 1000ms linear;
}

Afin///de MODIFIER comme tout le monde me dit de l'ajouter sur un a au lieu de a:hover...

État Initial:

text-color:black;
background:none;

Planait état:

Transition en douceur vers:

 text-color:white;
background:black;

J'espère que cela aide tout le monde
Merci pour votre temps!

Il semble fonctionner ici. jsfiddle.net/4zhnP ... avez-vous voulez quelque chose de ce genre? jsfiddle.net/pySY4
Il serait plus facile si vous avez inclus le code html. Vous devrez peut-être faire quelque chose comme .header > .navlinks > li > a:hover
oui quelque chose comme ça, mais plus lisse!

OriginalL'auteur user2766367 | 2013-10-14

  1. 6

    Les mettre sur la une (pas en passant la souris dessus) ET si vous voulez des transitions multiples, vous devez les déclarer ensemble.

    -webkit-transition: color 1000ms linear, background-color 1000ms linear;

    http://jsfiddle.net/4zhnP/1/

    Merci à vous, votre description et votre solution de façon claire,concise des informations sur le pourquoi et le comment faire. 😀

    OriginalL'auteur Moob

  2. 4

    Ne définissez pas le passage sur le :hover propriété.

    a {
color: white;
-webkit-transition: color 1000ms linear;
-moz-transition: color 1000ms linear;
-o-transition: color 1000ms linear;
-ms-transition: color 1000ms linear;
transition: color 1000ms linear;
background-color: purple;
-webkit-transition: background-color 1000ms linear;
-moz-transition: background-color 1000ms linear;
-o-transition: background-color 1000ms linear;
-ms-transition: background-color 1000ms linear;
transition: background-color 1000ms linear;
}

    Alors définir ce qui est en train de changer sur le :hover de la propriété.
    Par exemple, 

    a:hover{
color:green;
}
    Ok, donc Si je voulais d'abord la couleur du texte en noir, et pas de fond et une fois que vous placez le pointeur de la transition commence à couleur d'arrière-plan pourpre de texte et de couleur blanche comment?
    Vous auriez quelque chose comme ceci: a:hover{background:purple;color:white;}

    OriginalL'auteur Dan Johnson

  3. 1

    Vous devriez essayer de définir les transitions sur le a, au lieu de la a:hover.

    Vous pouvez trouver plus d'informations sur les transitions ici: https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Using_CSS_transitions

    Pourquoi recommandez-vous?

    OriginalL'auteur vanev_