CSS animation-delay 屬性

定義和用法

animation-delay 屬性定義動畫何時開始。

animation-delay 值以秒或毫秒計。

提示：允許負值，-2s 使動畫馬上開始，但跳過 2 秒進入動畫。

另請參閱：

CSS3 教程：CSS 動畫

HTML DOM 參考手冊：animationDelay 屬性

實例

例子 1

等待兩秒，然后開始動畫：

div {
  animation-delay: 2s;
}

親自試一試

例子 2

負值，請注意動畫跳過 2 秒進入動畫周期：

div {
  animation-delay: -2s;
}

親自試一試

CSS 語法

animation-delay: time;
值 描述 測試
time 可選。定義動畫開始前等待的時間，以秒或毫秒計。默認值是 0。 測試

技術細節

默認值： 0
繼承性： no
版本： CSS3
JavaScript 語法： object.style.animationDelay="2s"

瀏覽器支持

表格中的數字注明了完全支持該屬性的首個瀏覽器版本。

帶 -webkit-、-moz- 或 -o- 的數字表示使用前綴的首個版本。

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
43.0
4.0 -webkit-		 10.0 16.0
5.0 -moz-		 9.0
4.0 -webkit-		 30.0
15.0 -webkit-
12.0 -o-