.css()时间延迟,animation-delay

animation-delay

版本：CSS3

animation-delay CSS属性定义动画于何时开始，即从动画应用在元素上到动画开始的这段时间的长度。0s是该属性的默认值，代表动画在应用到元素上后立即开始执行。否则，该属性的值代表动画样式应用到元素上后到开始执行前的时间长度；定义一个负值会让动画立即开始。但是动画会从它的动画序列中某位置开始。例如，如果设定值为-1s，动画会从它的动画序列的第1秒位置处立即开始。如果为动画延迟指定了一个负值，但起始值是隐藏的，则从动画应用于元素的那一刻起就获取起始值。通常用animation简写属性一次性设置动画效果较为方便。

示例animation-delay: 3s;

animation-delay: 2s, 4ms;

浏览器支持

IE10以上版本的浏览器都支持animation-delay

语法animation-delay:

默认值0s

适用于

继承性无

动画性否

计算值指定值

媒体交互

实例

div

{

width:100px;

height:100px;

background:red;

position:relative;

animation:demo 5s infinite;

animation-delay:1s;

/*safari和chrome*/

-webkit-animation:demo 5s infinite;

-webkit-animation-delay:1s;

}

@keyframes demo

{

from{left:0px;}

to{left:450px;}

}

@-webkit-keyframes demo

{

from{left:0px;}

to{left:450px;}

}

效果图：