css3 animation

 

    css3 animation

 

• animation-name

           动画的名称，默认none

 

• animation-duration

           动画播放持续的时间，单位秒，默认0

 

• animation-timing-function

           还是ease,ease-in,ease-out这些

 

• animation-delay

          动画开始的时间，默认0，单位秒

 

• animation-iteration-count

           元素播放循环的次数，默认是1，infinite是无限次

 

• animation-direction

           元素动画播放的方向，有两个值：

 

1. normal             (默认)   每次循环向前
2. alternate          第偶数次向前播放，第奇数次向反方向播放

 

 

• animation-play-state

 

 

@-webkit-keyframes zhangyaochun{
		0%{
			padding:0;
		}
		50%{
			padding:0 20px;
		}
		100%{
			padding:0 100px;
		}
}

  -webkit-animation-name:zhangyaochun;

 

 

 

 

 

 

 

    先看一个兼容列表：