有沒有辦法讓webkit動畫無限期地運行?webkit動畫道具
1
A
回答
2
有一定是:
@-webkit-keyframes pulse {
from {
-webkit-transform: scale(1.0);
opacity: 0.75;
}
50% {
-webkit-transform: scale(1.2);
opacity: 1.0;
}
to {
-webkit-transform: scale(1.0);
opacity: 0.75;
}
}
img.pulse { opacity: 0.75; }
img.pulse:hover {
-webkit-animation-name: pulse;
-webkit-animation-duration: 0.5s;
-webkit-animation-iteration-count: 10;
}
這是從source, here
的重要組成部分採取觀察(很明顯,我想)是那些keyframes
@-webkit-keyframes pulse {/*...*/}
內,定義動畫的名字「脈衝'的from
(開始),50%的標記,和to
(結束)(你會注意到是完全一樣的from
聲明,給人以無縫動畫的印象。
退一步來說,似乎-webkit-animation-iteration-count: 10;
可能會出現問題,至於「無限」。如果省略該屬性意味着動畫出現一次,其值設置爲0
(預期)防止發生在所有的動畫。
所以,也許不是無限的,但它看起來很高興的值爲3000
,所以大概其他類似的大數字將是可行的。
修訂演示with super-large -webkit-animation-iteration-count
of over nine-thousaaaaaand...
編輯驚訝:
顯然infinite
爲,其實,對於一個-webkit-animation-iteration-count
valid argument。請參閱最新的演示,網址爲jsbin (again)。
相關問題
- 1. Webkit動畫
- 2. 多個webkit動畫
- 3. 反彈webkit動畫
- 4. -webkit動畫錯誤
- 5. 連鎖webkit動畫
- 6. WebKit jQuery動畫bug
- 7. Webkit變換不能用於Webkit動畫
- 8. 開始時的WebKit動畫
- 9. Webkit動畫徑向漸變?
- 10. webkit動畫不起作用
- 11. css動畫webkit問題
- 12. IE上的webkit動畫
- 13. Webkit動畫和變換
- 14. Ipad,Webkit動畫問題
- 15. WebKit的CSS3動畫循環
- 16. 軌道動畫
- 17. CSS3動畫只能使用webkit?
- 18. 如何實現webkit動畫:backgroundmove
- 19. Android Webview是否支持CSS3 WebKit動畫?
- 20. -webkit-動畫播放狀態在Chrome
- 21. 非webkit rotateY動畫與Jquery的Transform3d
- 22. iPhone的WebKit CSS動畫導致閃爍
- 23. 是否可以動畫-webkit-text-fill-color?
- 24. Webkit的動畫打破SVG下方
- 25. jQuery的動畫在WebKit瀏覽器慢
- 26. 使用JavaScript激活Webkit CSS3動畫
- 27. css3 webkit動畫停止在div:hover
- 28. 動畫-webkit-文本填充色
- 29. 在CSS3中轉換和webkit動畫
- 30. Zepto.js中有什麼webkit動畫可用
奇怪,他們沒有一個連續的選項... – hvgotcodes 2010-10-02 00:44:28
@ hvgotcodes,這是一個,不是嗎?但是,那我知道什麼?我仍然大吃一驚,說:'第一個字'不是一個有效的僞選擇器(加入':first-line'和':first-letter')... – 2010-10-02 00:51:35
@hvgotcodes,看到最新的編輯,那裏。 **允許**作爲一個值。 =) – 2010-10-02 00:56:07