Share Posted August 29, 2017 Hi, dear GSAP-community, I would like to animate an :after element width "staggerTo" and did read up on the "CSSPluginRule". What is unclear to me: - Is this plugin already included in TweenMax or not? If not, is is there any way to download it separately? (I only fund the configuration download, which include TweenLite...) - Is it even possible to use a "staggerTo" anim on pseudo elements? I prepared a pen, but that one does not work... Any tips would be greatly appreciated - thank you! See the Pen wqQPdy?editors=1111 by rowild (@rowild) on CodePen Link to post Share on other sites
Share Posted August 29, 2017 Hi @Robert Wildling The CSSRulePlugin is not loaded with TweenMax. The following is loaded with TweenMax: TweenLite TweenMax TimelineLite TimelineMax CSSPlugin AttrPlugin RoundPropsPlugin DirectionalRotationPlugin BezierPlugin EasePack You can load that plugin separately here: <script src="https://cdnjs.cloudflare.com/ajax/libs/gsap/1.20.2/plugins/CSSRulePlugin.min.js"></script> I don't think you can stagger that since it's affecting the CSS rule itself, but I'm no expert with that particular plugin so I'm sure someone will correct me if I'm wrong. I usually avoid pseudo elements except in rare cases of a little style. For elements I want to animate, I always loop through and append them as needed so they're actual DOM elements. Hopefully that helps. Happy tweening. 6 Link to post Share on other sites
Share Posted August 29, 2017 Yup, Craig is exactly right. A tween using CSSRulePlugin can't be staggered. A staggered animation implies that there are multiple targets (an array of objects) that will be animated with delays. When you animate a CSSRule it is a single thing which can't be staggered. 3 Link to post Share on other sites
