2013-04-09 121 views
11

我的CSS動畫在div:hover上宣佈animation-play-state: paused。問題是(至少在Chrome中),當鼠標懸停在元素上時,動畫會造成口吃/跳躍。CSS3動畫片斷/暫停後跳轉

這裏有一個的jsfiddle:http://jsfiddle.net/AHqLE/

有沒有人遇到過這個?

+6

是的,我也有同樣的問題 - 這似乎迅速跳回它的默認狀態,然後繼續拿起它離開的地方 – Ryan 2013-05-10 18:57:07

+0

動畫這是一個已知的錯誤,我想 - 看到了同樣的上Chrome 30.0.1599.69,其中啓動狀態在動畫恢復之前閃爍。你不是一個人! – Terry 2013-10-08 08:39:33

+0

我看着你的小提琴,並玩了一下。對我而言,一切運行順利。我在kubuntu與鉻25.0.1364.160,JavaScript \t V8 3.15.11.16 – luksch 2013-04-09 22:30:42

回答

0

我可以證實,這如今在最新的Chrome版本(版本31.0.1650.63)

附加的註釋對這一問題的工作:使用top/bottom值,我相信我解決了它(當時)反對translateY

0

嘗試添加-webkit-transform: translateZ(0);-webkit-transform: translate3d(0,0,0);以強制進行硬件加速。我將此添加到我使用的任何轉場或動畫中,以便Chrome不會留下痕跡。