Question

我在这里有点难过。

当我有一个动画时，这个悬停状态转换有效，现在我已经添加了一个它停止工作的那个？

.right-bird {
  height: 58px;
  position: relative;
  top: -26px;
  left: -80px;
  opacity: .8;
  -webkit-animation: bird-from-right 1.9s linear, jiggy 4s ease 2.5s forwards;
  z-index: 50;
  max-width: 100%;
  &:hover {
  -ms-transform: rotate(10deg);
  -webkit-transform: rotate(10deg);
  transform: rotate(10deg);
  } 
}

有任何想法/建议吗？

Answer 1

恕我直言你的动画确实有效。

但是：您在rotate动画和jiggy状态下使用hover。在这种情况下，：悬停旋转可以 - 悬停 - 替换动画。

顺便说一句，例如使用Sass和CSS动画（跨浏览器），您应该放置your code in a CodePen而不是jsfiddle。在Codepen，你有一个Sass编译器和autoprefixer，否则调试代码会变得更复杂。

多个动画后悬停状态不起作用

1 个答案: