Jump to content
GreenSock

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

applying animation after adding a class

Warning: Please note

This thread was started before GSAP 3 was released. Some information, especially the syntax, may be out of date for GSAP 3. Please see the GSAP 3 migration guide and release notes for more information about how to update the code to GSAP 3's syntax. 

Recommended Posts

Hey.
Please help to make this animation play only after adding the "active" class to "textDiv".

thanks

See the Pen kuych by GreenSock (@GreenSock) on CodePen

Share this post


Link to post
Share on other sites

@Mukaytegin ... let me first ask ... what would be the condition under which "active" would be added as a class to #textDiv?

Share this post


Link to post
Share on other sites
Hey.
scroll animation plugin adds a class from the data attribute

 

 

Share this post


Link to post
Share on other sites

 <div id="textDiv" data-animation="active">a quick sample of letter by letter animation</div>

Share this post


Link to post
Share on other sites

You can bind DOMSubtreeModified to listen for changes to the element's properties (i.e. classes, data attributes, etc.). In this Pen, a button click adds the data attribute, and the listener reacts to that.

 

See the Pen rbyPmK by sgorneau (@sgorneau) on CodePen

  • Like 4

Share this post


Link to post
Share on other sites

Cool.

Thank you very much. You've saved me a lot of work with that.

  • Like 1

Share this post


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

Warning: Please note

This thread was started before GSAP 3 was released. Some information, especially the syntax, may be out of date for GSAP 3. Please see the GSAP 3 migration guide and release notes for more information about how to update the code to GSAP 3's syntax. 


  • Recently Browsing   0 members

    No registered users viewing this page.

×