Jump to content
GreenSock

Search In
  • More options...
Find results that contain...
Find results in...
s-15

Clip-path animation not working

Go to solution Solved by PointC,

Recommended Posts

The clip-path animation in the mentioned code pen is not working.

 

Can someone please point out what am I doing wrong? The other one with ellipse works just fine - https://codepen.io/sayaliga15/pen/abmpMdY

See the Pen PoGOvYr by sayaliga15 (@sayaliga15) on CodePen

Link to post
Share on other sites

Hi @s-15 :)

 

Welcome to the forum. 

 

Looks like updating to the latest version of GSAP makes everything work correctly. (You were using a version that is several years old.)

See the Pen RwGjXZy by PointC (@PointC) on CodePen

 

I also changed you syntax to the GSAP 3. Check out the migration guide for all the info.

Happy tweening.

 

  • Like 3
Link to post
Share on other sites

 

I just wanted to say the same along those lines of what @PointC just said.

 

Looks like maybe animating clip-path wasn't supported back then?

 

Even with the latest TweenMax it already works.

 

See the Pen RwGjXLJ by akapowl (@akapowl) on CodePen

  • Like 4
Link to post
Share on other sites

Hey folks, a bit off-topic but I’m just wondering has CSS clip-path support changed dramatically since my simple inquiry earlier in the year. I’ve seen numerous threads shortly after that mentioned one all the way up to this one over time. When clip-path polygon has been mentioned with no suggestion of SVG as an alternative for offering better support.

 

I’ve just been wondering given the responses I received in that thread verse the many responses I’ve since read in newer threads with no suggestion of SVG. Browser support to my knowledge has not really dramatically improved to become more inclusive since that original inquiry or am I in-fact mistaken?

  • Like 2
Link to post
Share on other sites

@PointC @akapowl Thanks. Updating the version did make it work. Since clip-path ellipse worked with the older version I was expecting the polygon one to work. Seems like upgrading is the only option. 

Link to post
Share on other sites
18 hours ago, Shrug ¯\_(ツ)_/¯ said:

no suggestion of SVG as an alternative for offering better support.

I think I've said so that so many times that I thought I could stop saying it. It should be branded in the forum scrolls of history. :D

 

SVG is always my go-to for masks and clip-paths. I don't even bother checking support for anything else so if CSS clip-path suddenly gets broader support could somebody let me know? Thanks. ;)

  • Like 2
Link to post
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.

×