首页 > 其他 > 详细

常用animation动画

时间:2017-12-23 15:22:03      阅读:196      评论:0      收藏:0      [点我收藏+]

/*编辑动画名*/
animation-name: myDemo;

/*动画持续时间*/
animation-duration: 6s;

/*动画方向*/
/*reverse 反向*/
/*alternate 从后向前播放动画*/
/*alternate-reverse 从后向前播放动画且反向*/
animation-direction: alternate;

/*动画执行次数*/
/*infinite 循环播放*/
animation-iteration-count: infinite;

/*动画结束后的位置*/
/*forwards 保留最后一个属性值*/
animation-fill-mode: forwards;

/*动画延迟*/
animation-delay: 1s;

/*动画运动方式*/
/*linear 动画从头到尾的速度是相同的。 测试
ease 默认。动画以低速开始,然后加快,在结束前变慢。 测试
ease-in 动画以低速开始。 测试
ease-out 动画以低速结束。 测试
ease-in-out 动画以低速开始和结束。 测试
cubic-bezier(n,n,n,n) 在 cubic-bezier 函数中自己的值。可能的值是从 0 到 1 的数值。*/
animation-timing-function: linear;

常用animation动画

原文:http://www.cnblogs.com/victory-jc-notes/p/8093286.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!