[CSS Animation] 4. 使用 animation-iteration-count 設定播放次數

在之前的文章中,我們學會了建立動畫,將該動畫套用至元素上,及設定動畫執行期間的秒數。在這樣的過程當中,動畫僅會執行「一次」,結束後就會回到元素本身的初始狀態。那如果要設定動畫的播放次數該怎麼辦呢?animation-iteration-count 就可以派上用場了。

animation-iteration-count 使用方式

它的值可以是 0正整數infinite

  • 0:代表該動畫並不會播放。
  • 正數整:表示該動畫的播放次數,例:2 即會播放兩次。
  • infinite:表示該動畫會播放無限多次。

範例

 

您可在此處留言

avatar

這個網站採用 Akismet 服務減少垃圾留言。進一步瞭解 Akismet 如何處理網站訪客的留言資料

  Subscribe  
Notify of