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;

 

 

 

 

 

 

 

    先看一个兼容列表：