2022-1-22 animate css开始动画和暂停动画

shangrila-xiu

于 2022-01-22 10:10:17 发布

阅读量384

点赞数 1

分类专栏： css3 css 文章标签： css 动画 css3

本文链接：https://blog.youkuaiyun.com/lyx9611/article/details/122633526

版权

css 同时被 2 个专栏收录

12 篇文章

订阅专栏

css3

5 篇文章

订阅专栏

@keyframes upDownAni {
    0%{
      opacity: 0.5;
      transform: translateY(-5px);
    }
    50%{
      opacity: 1;
      transform: translateY(5px);
    }
    100%{
      opacity: 0.5;
      transform: translateY(-5px);
    }
  }
 
.img {
  width: 200px;
  height: 200px;
  border-radius: 50%;
  animation: upDownAni 5s linear infinite;
}
.active {
  animation-play-state: running;
}
.paused {
  animation-play-state: paused;
}