延迟返回位置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。