为了账号安全,请及时绑定邮箱和手机立即绑定

step 中设置 end 或 start 会造成什么差异吗?

    .birdFly {
        -webkit-animation:bird-slow 400ms steps(3,start) infinite;
    }
    
    @-webkit-keyframes bird-slow{
        0%{
            background-position: 0% 0%;
        }
        100%{
            background-position: -300% 0%;
        }
    }

step 中设置成 end 和 设置成 start 貌似没有什么区别,是因为循环播放的关系吗?

正在回答

1 回答

我的理解是

end时 

第一步background-position-x 是0%~-100% 执行

第二步background-position-x 是-100%~-200% 执行

第三步background-position-x 是-200%~-300%  不执行

start时

第一步background-position-x 是0%~-100%  不执行

第二步background-position-x 是-100%~-200% 执行

第三步background-position-x 是-200%~-300%  执行

动画方向顺序不同

0 回复 有任何疑惑可以回复我~

举报

0/150
提交
取消

step 中设置 end 或 start 会造成什么差异吗?

我要回答 关注问题
意见反馈 帮助中心 APP下载
官方微信