bichant Posted February 14, 2020 Share Posted February 14, 2020 This seems simple enough but for some reason it is not working for me. I have a tween inside a timeline that should play when the 'Change Mode' button is clicked. The opacity of the box should fade to 0 over three seconds and repeat. Click the button and nothing happens. If you move var tl = to the tween, and comment out the timeline, it works as it should. Thanks for the help! See the Pen MWwKZLG by bichant (@bichant) on CodePen Link to comment Share on other sites More sharing options...
OSUblake Posted February 14, 2020 Share Posted February 14, 2020 2 minutes ago, bichant said: If you move var tl = to the tween, and comment out the timeline, it works as it should. If you want to control a timeline, then you need to add animations to the timeline. Right now your timeline is empty. var tl = gsap.timeline({ paused: true }) .to("#rect", { opacity: 0, duration: 3, ease: "back", repeat: -1 }); 3 Link to comment Share on other sites More sharing options...
bichant Posted February 14, 2020 Author Share Posted February 14, 2020 OK. So changing opacity isn't an animation. Thanks! Link to comment Share on other sites More sharing options...
ZachSaucier Posted February 14, 2020 Share Posted February 14, 2020 5 minutes ago, bichant said: changing opacity isn't an animation. It is. You were just using gsap.to() instead of tl.to() You have to add the tween to the timeline for the timeline to have a duration. Alternatively you could manually add the tween: const tween = gsap.to(...); tl.add(tween); Link to comment Share on other sites More sharing options...
bichant Posted February 14, 2020 Author Share Posted February 14, 2020 Thank you gentleman! That works. Link to comment Share on other sites More sharing options...
Recommended Posts
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 accountSign in
Already have an account? Sign in here.
Sign In Now