Javascript SVG动画在firefox上不起作用

我正在尝试使用这个动画

在一个网站上，但它似乎并不完全兼容Firefox浏览器（在chrome浏览器上，它工作得非常完美），有没有办法让它适用于所有浏览器

我尝试更改对动画库的javascript调用，使用

from

而不是

fromTo

等，在chrome中一切正常，但在firefox中却不行。（或者如果有人知道其他类似的动画，我也可以使用它：D）。

---

非常感谢

如果让我猜的话，我会说这是您使用的动画库的问题

在动画中，它尝试设置

元素高度的动画，以提供上升填充效果。注意下面代码中的高度7%->66%过渡

.fromTo("#rectangle", 7, {fill:"#000", alpha: "0%", height: "7%"}, {fill: "#f5e317", alpha: "100%", height: "66%", ease: Power3.easeInOut}, "-=1")

在动画运行时，矩形的高度实际上不会改变。因此，我怀疑这可能是动画库在动画过程中设置高度的方式存在缺陷或不兼容

减少演示：

---

如果你在这里没有答案，我会考虑向Greensock求助，或者发布一个bug报告。

RecT高度不是SVG 1.1中的CSS属性，它是一个属性（在这种情况下，Firefox只支持SVG 1.1）。REST高度被建议是SVG 2中的CSS属性（在这种情况下，Chrome支持SVG 2）。SVG2尚未完成，Firefox可能会及时支持此功能，就像它支持Chrome尚不支持的其他SVG2功能一样。GSAPI应该足够聪明，能够真正隐藏这个问题。@Robert，我没有使用Greensock，所以不想在我的回答中假设它只是动画CSS属性。但我可能应该包括这些信息。我认为在某些情况下，它确实可以设置属性的动画。大概这只是这个特定API中的一些疏忽，正如OP在动画作品中所说的那样。

.fromTo("#rectangle", 7, {fill:"#000", alpha: "0%", height: "7%"}, {fill: "#f5e317", alpha: "100%", height: "66%", ease: Power3.easeInOut}, "-=1")