Question

请考虑this示例。

我想知道为什么显示器不起作用。在这个苹果旋转＆amp;填充颜色也在50％变化，但100％显示没有，苹果不会消失，为什么会这样？

MDN says display的{{1}}个文档display

＆＃13;

animatable

＆＃13;

* {
  padding: 0px;
  margin: 0px;
  border: 3px dotted black;
}
.group {
  transform-origin: center;
  animation: animateApple 1s linear;
}
@keyframes animateApple {
  0% {} 50% {
    fill: yellow;
    transform: rotate(-150deg);
  }
  100% {
    display: none;
  }
}

＆＃13;

Answer 1

我不是百分百肯定，但我不相信你可以动画All value are accept the query string in page load how it's work

这可以让苹果消失：

display: none

您可以随时添加其他关键帧以完善动画渐变持续时间。

使用javascript的JQuery库的另一个选择。这将使用@keyframes animateApple{ 0%{ } 50%{ fill:yellow; transform: rotate(-150deg); } 100%{ opacity: 0; } }函数。：

setTimout()

希望这会有所帮助并祝你好运！

关键帧中使用的显示器＆amp;没有在svg元素上工作

1 个答案: