在SVG上使用gsap动画进行不透明度渲染的问题

时间:2019-06-04 07:59:51

标签: css google-chrome svg opacity gsap

我对此网站有疑问:http://nousprochesaidants.com/#carte

该网站主要使用SVG构建,并使用GSAP库进行动画处理。

由于某些原因,我在chrome上出现了一些渲染问题,即使是最新版本也是如此。

您可以在此处查看图片示例:https://thomas-dev.com/images/opacity-nok.jpg

如您在背景上的三角形上看到的那样,不透明性在左侧的渲染不正确,但在右侧的渲染很好。

Chrome似乎无法在某些计算机上呈现不透明度属性,就好像它需要更多的内存/ cpu ...

我该如何调试它,您对这里发生的事情有任何了解吗?

谢谢!

1 个答案:

答案 0 :(得分:0)

快速解决方法:从will-change: opacity;中删除#app #particles-js {}


我希望可以在一个小的静态示例中重现此内容。但是它在抵抗我。可能还有另一个因素在起作用,可能与脚本有关,这可能是导致错误的原因。

如果您可以在网站的某个地方发布损坏版本的副本,我相信Chrome浏览器的人们会很感激的。然后在http://crbug.com上为他们提交错误。