animation操作transform:translate3d没有动画效果

最新推荐文章于 2024-06-29 12:14:17 发布

csu_zipple

最新推荐文章于 2024-06-29 12:14:17 发布

阅读量3.5k

点赞数

分类专栏：前端杂事文章标签： animation bug

本文链接：https://blog.csdn.net/csu_passer/article/details/86632495

版权

前端杂事专栏收录该内容

205 篇文章 6 订阅

订阅专栏

bug

无往不利的animation突然就没有了往日的效果，吓坏我了–

solution

仔细看了看自己写的代码

 @keyframes move {
    0% {
      transform: translate3d(0,-8px);
    }
    50% {
      transform: translate3d(0,8px);
    }
    100% {
      transform: translate3d(0,-8px);
    }
  }

流下了基础不牢的泪水–我以为translate3d和translate一样可以把参数为0的可以省略不写…

 @keyframes move {
    0% {
      transform: translate3d(0,-8px,0);
    }
    50% {
      transform: translate3d(0,8px,0);
    }
    100% {
      transform: translate3d(0,-8px,0);
    }
  }