DesignCourse

In the codepen demo below, you can comment out the top 8 lines of JS and uncomment the ones beneath to see how I intend the animations to unfold. The purple swirl graphic is supposed to animate from y:30 and opacity: 0 as it does on the non-timeline version. When I try to replicate the coding to work with the timeline, everything works, except the swirl graphic stays hidden while it's supposed to be fading from 0 and moving up 30 pixels. Any idea why this isn't working? Thanks a lot, this is for a tutorial I intend on releasing tomorrow, but this is snagging me up! (PS: Not yet responsive, just for desktop!)

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: 1, stagger: .5}); They're all animating at the same time

Doh, thanks!

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!

@GreenSock yep I'm planning on covering both of those. In fact, tomorrow, I am releasing a TimelineMax tutorial using the previous lesson's project. Ultimately, I want to release a full course using it in serious project(s).

Awesome! I just released one today: I'm planning on covering several more, TimelineMax definitely being next. So far, learning has been a breeze!

I'm not sure why it took me so long to join, a lot of people on my YouTube chan (@DesignCourse, nearing 300k subs!) have requested GSAP content. The greatest UI animations I've seen almost always revolve around GSAP. Hopefully I will pick it up quickly! Edit: I'm going to start learning asap, but if anyone has some recommendations in terms of courses/existing tutorials, let me know. Thanks.