【问题标题】:SVG animation and firefoxSVG 动画和火狐
【发布时间】:2014-05-18 15:51:41
【问题描述】:

我在 SVG 动画绘制上苦苦挣扎,它在所有浏览器上都能完美运行(即使 IE 也没有问题),只有 firefox 无法正确绘制

脚本可以在所有现代浏览器上自行工作 脚本取自 - http://tympanus.net/Development/SVGDrawingAnimation/

但是当我从矢量图像生成 SVG 代码时,它在 firefox 上不起作用 示例 - CODEPEN

这是 100% 的 svg 路径问题,与代码有关。但是什么?

【问题讨论】:

  • 在 FF 23.0.1 中对我来说可以正常工作。 FF 似乎有 24 版,但由于某种原因,它不会从我的“关于”窗口自动更新。
  • 我有 FF 28 但它不工作。当然是动画,因为 svg 本身可以工作。

标签: jquery html animation svg


【解决方案1】:

如果您在 Firefox DOM 检查器中查看 <path> 样式,您会发现它拒绝解析某些 stroke-dasharray 值。如果没有破折号图案,您将看不到这些路径上的动画。

特别是,Firefox 遇到问题的路径都报告了以数十亿为单位的总长度。现在,规范中没有任何内容表明路径长度和破折号模式不能有数十亿个单位长,但 Firefox 实现只能达到某个最大值并不是不合理的。 p>

不合理的是,Firefox 一开始就计算了如此极端的路径长度。例如,对于绘图中的第一条路径,FF28 报告的路径长度为 308225966080,而 Chrome 将其计算为 920.6 左右。

原来getTotalLength 的问题是known bug in Firefox 28希望它会尽快解决!

【讨论】:

    猜你喜欢
    • 2011-01-04
    • 2012-04-12
    • 2017-11-19
    • 1970-01-01
    • 2021-03-30
    • 1970-01-01
    • 2014-03-05
    • 2023-03-13
    • 1970-01-01
    相关资源
    最近更新 更多