问答详情
源自:9-8 CSS3中设置动画的播放状态

对暂停状态的疑惑

例题中说”另外如果暂停了动画的播放,元素的样式将回到最原始设置状态。“这个最原始的设置状态指什么?我暂停后,怎么就是当前状态呢?看一下我的代码里,例如背景颜色变到 50%{background:red;}红色时暂停,那么它的背景颜色就是保持为红色啊。

提问者:天窗的蚂蚁 2016-01-09 21:35

个回答

  • qq_嶸歸_0
    2018-08-21 10:30:50

    你的问题可以这样解决,

    如果暂停了动画的播放,元素的样式将回到最原始设置状态

    span{

      display: inline-block;

      width: 20px;

      height: 20px;

      background: orange;

      transform: translateY(90px);

      animation-name: move;

      animation-play-state:paused;

    }

    div:hover span {

      animation-name: move;

      animation-duration: 10s;

      animation-timing-function: ease-in;

      animation-delay: .2s;

      animation-iteration-count:infinite;

      animation-direction:alternate;

     animation-play-state:running;

    }


  • 雨过之后
    2016-03-12 09:02:47

    我的理解是:最原始的状态指它的图形自身是否经历变形。你可以试一试,在运动的过程中改变一下他的形状或者颜色之类的