延迟退还位置CSS3过渡

Question

是否有延迟一个div过渡时，它的动画回到它的原始状态的一种方式，但不是当它开始动画？

例：

[ ] <- hover over this 
[  ] <- immediately changes to this 
[  ] <- stop hovering, stays like this for a second or two 
[  ] 
[  ] 
[  ] <- then animates back to original state 
[ ] 
[ ] 
[ ] 
[ ] 

Answer 1

是。您可以在悬停状态下重新定义动画。

selector { 
    property: value1; 
    transition: property 1s 1s linear; /* transition: property duration delay easingfunction; */ 
} 
selector:hover { 
    property: value1; 
    transition: none; /* No animation */ 
} 

不要忘记添加供应商前缀。 transitions & CSS3，auto vendor prefixer：上Futher informtation。