CSS Webkit Transition Fondu lentement que Fade in

C'est ce que j'ai:

.box{
    background:#FFF;
    -webkit-transition: background 0.5s;
}

.box:hover{
    background:#000;
}

Mais cela ajoute à la fois onmouseover et onmouseout actions, mais n'est-ce pas là un moyen de les contrôler? Quelque chose comme:

-wekbkit-transition-IN: background 1s;
-webkit-transition-OUT: background 10s;

OriginalL'auteur Adam | 2011-04-14

  1. 30

    Juste redifine votre transition dans le pseudo-élément.

    .box{
    background: white;
    -webkit-transition: background 5s;
}
.box:hover{
    background: olive;
    -webkit-transition: background 1s;
}

    Regarde mon http://jsfiddle.net/DoubleYo/nY8U8/

    OriginalL'auteur Yoann

  2. 0

    Soit utiliser un animation (uniquement dans webkit actuellement), ou d'utiliser JS pour ajouter et supprimer les propriétés, ils seront toujours à animer.

    OriginalL'auteur Rich Bradshaw