CSS Webkit 过渡 - 淡出比淡入慢答案

【问题标题】：CSS Webkit Transition - Fade out slowly than Fade inCSS Webkit 过渡 - 淡出比淡入慢
【发布时间】：2011-08-05 19:49:03
【问题描述】：

这就是我所拥有的：

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

.box:hover{
    background:#000;
}

但这附加到 onmouseover 和 onmouseout 动作，但没有办法控制它们吗？比如：

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

【问题讨论】：

【解决方案1】：

只需在 over 伪元素中重新定义过渡。

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

【讨论】：

【解决方案2】：

要么使用animation（目前仅在webkit中），要么使用JS添加和删除属性，它们仍然会动画。

【讨论】：