完成CSS轉換時，取消宿主

.example:hover { 
    transform: skew(30deg,20deg); 
    transition: all 10s ease-in-out; 
}

如果我將鼠標懸停，它將開始執行10秒。但是如果我在10秒之前停止播放，它會停止播放。完成CSS轉換時，取消宿主

有沒有一種方法來取消該元素，並仍然完成整個10秒的歪斜？

換句話說，將鼠標懸停一次，無論您是否取消停留，它都會閃爍10秒。

2013-07-03 Sunny

它是一個解決方案，包括相反的效果（即回到正常）在無遮擋？像這樣：http://jsfiddle.net/NDmwj/（注意我減少了3秒的時間，以使測試更快） –

我需要它繼續在同一個方向上取消停留。有任何想法嗎？ – Sunny

我不認爲你可以在純CSS中做到這一點;你可能會需要Javascript，就像bboy說的那樣。我很好奇，是否有任何CSS-only解決方案。 –

你需要使用jQuery的hover和css

更新：你可能要增加適當的前綴上變換

2013-07-03 08:49:40 bboy

歪斜10秒鐘後，我立即需要回到其原始狀態（所以再次懸停元素會再次閃爍10秒鐘等等）。 – Sunny

mmm jquery'hover'沒有回調，所以我們需要使用'animate' – bboy

回答