【CSS3】设置动画播放方向
2016-02-24 23:31
435 查看
animation-direction属性主要用来设置动画播放方向,其语法规则如下:
其主要有两个值:normal、alternate
1、normal是默认值,如果设置为normal时,动画的每次循环都是向前播放;
2、另一个值是alternate,他的作用是,动画播放在第偶数次向前播放,第奇数次向反方向播放。
例如:通过animation-direction属性,将move动画播放动画方向设置为alternate,代码为:
注意:Chrome或Safari浏览器,需要加入-webkit-前缀!
animation-direction:normal | alternate [, normal | alternate]*
其主要有两个值:normal、alternate
1、normal是默认值,如果设置为normal时,动画的每次循环都是向前播放;
2、另一个值是alternate,他的作用是,动画播放在第偶数次向前播放,第奇数次向反方向播放。
例如:通过animation-direction属性,将move动画播放动画方向设置为alternate,代码为:
animation-direction:alternate;
注意:Chrome或Safari浏览器,需要加入-webkit-前缀!
相关文章推荐
- 侧边导航栏css示例
- css3 skew变形
- HTML+CSS慕课网学习总结(三)
- css媒体查询
- 【CSS3】设置动画播放次数
- 【CSS3】设置动画开始播放的时间
- 【CSS3】设置动画播放方式
- 【CSS3】设置动画播放方式
- 【CSS3】设置动画播放时间
- 【CSS3】调用动画
- 2016/2/24 1,css有几种引入方式 2,div除了可以声明id来控制,还可以声明什么控制? 3,如何让2个div,并排显示。4,清除浮动 clear:left / right / both
- 【CSS3】Keyframes介绍
- CSS Sprite(CSS贴图)
- css3box-flex属性
- 【CSS3】动画--过渡延迟时间 transition-delay
- 【CSS3】动画--过渡函数 transition-timing-function
- 【CSS3】动画--过渡所需时间 transition-duration
- 【CSS3】动画--过渡属性 transition-property
- 【CSS3】变形--原点 transform-origin
- 【CSS3】matrix