美文网首页程序员
帧动画停在最后一帧

帧动画停在最后一帧

作者: 水汽yoyo | 来源:发表于2019-10-19 22:23 被阅读0次

这个链接详细介绍了帧动画的一些基本知识:https://www.cnblogs.com/rqqd/p/7998886.html
有的帧动画是infinite的,所有设置start,end,backwards,forwards没啥影响,
但有时候需要帧动画只执行一次,并且停留在最后一帧,刚开始搜到的是说设置forwards就可以,其实不是,还与设置的stes动画有关,这里确实要设置forwards,但是ox11里面就不能是:

@keyframes ox11 {
  0% {
    background-position: 0 0;
  }
  100% {
    background-position: -280vw 0;
  }
}

而是:

.animate11 {
  background-size: 280vw 50vw ;
  background-image: url(' ');
  animation: ox11 6s steps(4, end) 1000ms 1  normal forwards;
}
@keyframes ox11 {
  0% {
    background-position: 70vw 0;
  }
  100% {
    background-position: -210vw 0;
  }
}

这样才能保证是停留在最后一帧。

相关文章

  • 帧动画停在最后一帧

    这个链接详细介绍了帧动画的一些基本知识:https://www.cnblogs.com/rqqd/p/799888...

  • css动画

    css动画首先要明白动画是一帧一帧的,由多个帧拼起来的动画 @keyframes 此为动画样式中的关键帧,用关键帧...

  • 对WindowManager中的View设置动画

    1.直接对View设置传统动画 传统动画包括帧动画和补间动画。帧动画主要是一帧一帧的播放。可以在xml中使用 标签...

  • Android属性动画解析,让天下没有难画的动画

    在属性动画出现之前,Android的动画包括逐帧动画、补间动画两种。逐帧动画类似于gif图片,一帧一帧的播放准备好...

  • 浅谈swift动画(二)

    逐帧动画 逐帧动画的实现就是将图片一帧一帧的渲染,然后在短时间内依次展示出来,即可实现动画效果。 基于NSTime...

  • 新学的概念

    关键帧动画:从一帧到另一帧之间的过度,通过连续的运动来填充。 帧:最小单元时间间隔。 关键帧:带有特定动作的一帧。...

  • 如何用 CSS3 制作过渡动画 (2D变形transform)

    transition: 过渡动画: 是从一个状态 渐渐的过渡到另外一个状态 帧动画:通过一帧一帧的画面按照固定...

  • 每日一问(二十二)Android动画有几种,对其理解

    1.视图动画。视图移动、view真真的位置并未移动。 2.帧动画。就和放电影一样,一帧一帧的播 3.属性动画。视图...

  • css3

    关于css3动画参数设置 animation: mybigpic 1s forwards; 让动画停留在最后一帧;...

  • 更新Android设备开机logo和动画

    开机logo需要 .img 格式的文件动画是一帧一帧的图片组成,在bootanimation.zip 里面

网友评论

    本文标题:帧动画停在最后一帧

    本文链接:https://www.haomeiwen.com/subject/crznmctx.html