Jump to content
Search Community

SVG rendering issue when animated

CHS Digital test
Moderator Tag

Go to solution Solved by ZachSaucier,

Recommended Posts

Hi all,

 

I seemed to have unearthed a bug on Chrome and Edge (webkit I think) where  staggered lines appear when and svg is animated down (specifically on scaling). The lines appear randomly (different on every load it seems) as it animates down to size. This appears to happen in webkit all of a sudden and was just going to see anyone has come across it at all and if you could propose a fix (be it a GSAP setting or CSS property)? My efforts so far have not done the trick.

 

The below codepen demonstrates a simplified example which I have slowed down using timescale (does show at 1x) and also repeated.

 

Any help would be greatly appreciated

 

See the Pen yLabwpJ by samwoodchs (@samwoodchs) on CodePen

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...