CSS3 animation动画,循环间的延时执行该怎么弄
答案:2 悬赏:40 手机版
解决时间 2021-03-08 00:58
- 提问者网友:原来太熟悉了会陌生
- 2021-03-07 03:56
CSS3 animation动画,循环间的延时执行该怎么弄
最佳答案
- 五星知识达人网友:毛毛
- 2021-03-07 05:09
animation定义和用法
animation 属性是一个简写属性,用于设置六个动画属性:
animation-name
animation-duration
animation-timing-function
animation-delay
animation-iteration-count
animation-direction
默认值:
none 0 ease 0 1 normal
注释:请始终规定 animation-duration 属性,否则时长为 0,就不会播放动画了。
语法
animation: name duration timing-function delay iteration-count direction;
animation-name
规定需要绑定到选择器的 keyframe 名称。。
animation-duration
规定完成动画所花费的时间,以秒或毫秒计。
animation-timing-function
规定动画的速度曲线。
animation-delay
规定在动画开始之前的延迟。
animation-iteration-count
规定动画应该播放的次数。(值:n次,infinite无限循环)
animation-direction
规定是否应该轮流反向播放动画。
总结:
根据上述属性,只需要根据具体情况设置animation-delay和animation-iteration-count即可。
例如:
div
{
animation:mymove 5s 5s infinite;
-webkit-animation:mymove 5s 5s infinite;
}
animation 属性是一个简写属性,用于设置六个动画属性:
animation-name
animation-duration
animation-timing-function
animation-delay
animation-iteration-count
animation-direction
默认值:
none 0 ease 0 1 normal
注释:请始终规定 animation-duration 属性,否则时长为 0,就不会播放动画了。
语法
animation: name duration timing-function delay iteration-count direction;
animation-name
规定需要绑定到选择器的 keyframe 名称。。
animation-duration
规定完成动画所花费的时间,以秒或毫秒计。
animation-timing-function
规定动画的速度曲线。
animation-delay
规定在动画开始之前的延迟。
animation-iteration-count
规定动画应该播放的次数。(值:n次,infinite无限循环)
animation-direction
规定是否应该轮流反向播放动画。
总结:
根据上述属性,只需要根据具体情况设置animation-delay和animation-iteration-count即可。
例如:
div
{
animation:mymove 5s 5s infinite;
-webkit-animation:mymove 5s 5s infinite;
}
全部回答
- 1楼网友:想偏头吻你
- 2021-03-07 06:12
delay只针对第一次有效,貌似没有其他属性可以直接控制循环间隔,不过可以修改keyframes里的百分比,比如你原本的动画0%到100%,完成需要3s,间隔3s。那么将50%到100%的动画效果改成一样(相当于静止),再将完成时间改为6s。
我要举报
如以上问答信息为低俗、色情、不良、暴力、侵权、涉及违法等信息,可以点下面链接进行举报!
大家都在看
推荐资讯