Jump to content
GreenSock

Search In
  • More options...
Find results that contain...
Find results in...
DesignCourse

Invalid scaleY tween of 0 Missing plugin? gsap.registerPlugin()

Recommended Posts

Hey all,

I'm trying to animate an :after selector with the CSSRulePlugin, but I can't get it to work.  I've linked the codepen, and I've tried adding `gsap.registerPlugin(CSSRulePlugin);' but it still is giving me that error.  I'm sure it's a simple issue, but I've tried forum searching/Google and can't find the solution.

 

Thanks!

See the Pen gOOjeyg by designcourse (@designcourse) on CodePen

Link to post
Share on other sites

Hi @DesignCourse and Welcome to the GreenSock forum!

 

Also keep in mind with the CSSRulePlugin, that you want to keep using the old single colon syntax ( : ) when using the pseudo-elements of  :after and :before like in your codepen. This way you don't have to worry about issues if you use the new double colon syntax ( :: ) of pseudo-elements.

 

Happy Tweening :)

  • Like 1
Link to post
Share on other sites

I've come across another issue/question -- stagger doesn't seem to be working with this setup (there are 3 spans):

var rule = CSSRulePlugin.getRule("span:after");
gsap.to(rule, {cssRule: {scaleY: 0}, duration: 1stagger: .5});

They're all animating at the same time

Link to post
Share on other sites
3 minutes ago, DesignCourse said:

I've come across another issue/question -- stagger doesn't seem to be working with this setup (there are 3 spans):

CSSRulePlugin affects the actual stylesheet, so you can't affect individual elements (unless they have their own selector and you use that selector). Does that make sense? span:after has to apply to all elements that match it because that's the way that CSS works.

 

Most likely it's easiest to make it a real element and use a regular (non-CSSRulePlugin) tween if you need to do this.

  • Like 1
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.

×