html - 在鼠标悬停时旋转一个 div 并在鼠标移开时继续

Question

我有一个 div，我将其旋转 360 度，并在悬停样式上使用 css 过渡。当鼠标离开时，动画停止并且 div 返回其原始样式。即使鼠标不在 div 中，是否可以继续旋转直到完成 360 度旋转？我正在寻找纯 css 解决方案，而不是 jscript。

感谢您的帮助:)

Answer 1

恐怕没有一个完美的解决方案。 Robert McKee 之前发布了一个解决方法这包括在普通 css 选择器中使用具有高延迟的动画。

有一个旋转的 jsfiddle 示例: http://jsfiddle.net/akko82/FNKMF/

这一行将完成这项工作:

-webkit-animation:rotateAnimation 3600ms ease-in-out 6000s;

其中 rotateAnimation 是我们的动画，6000s 是延迟。