ALTIMAX Posted December 18, 2020 Share Posted December 18, 2020 Hi all, I have a simple timeline (here just a little part) with some tweens, one of them have an onComplete callback. mobileTimeline = gsap.timeline({paused: true}) .to(pictures, {opacity: 0, duration: 0.5, onComplete: switchPic}) .to(pictures, {opacity: 1, duration: 0.5}, ">"); function switchPic(){ let picA = pictureA.find('.HomeIntro-img').attr('src'); let picB = pictureB.find('.HomeIntro-img').attr('src'); pictureA.find('.HomeIntro-img').attr('src', picB); pictureB.find('.HomeIntro-img').attr('src', picA); } Everythings runs well when i trigger mobileTimeline.play(), but i want to trigger the event callback on mobileTimeline.reverse() too. I have tried the onReverseComplete callback on the tween but it didn't triggered.. Someone can explain me how to proceed ? Thanks ! Link to comment Share on other sites More sharing options...
Solution ZachSaucier Posted December 18, 2020 Solution Share Posted December 18, 2020 Hey ALTIMAX and welcome to the GreenSock forums. Thanks for supporting GreenSock with a Business Green membership! To have a function run when you play a timeline runs forwards and reverses it'd probably be best to use a .call(). I'd rewrite your timeline like so: mobileTimeline = gsap.timeline({paused: true}) .to(pictures, {opacity: 0}) // 0.5 is default duration - not needed .call(switchPic) .to(pictures, {opacity: 1}) // tweens are automatically sequenced - position parameter not needed See the Pen ZEpyyGG?editors=0010 by GreenSock (@GreenSock) on CodePen Side note: Switching out SRCs isn't the best because the new image has to take time to load. It might be better to have multiple img elements and switch them out inside of your function call. 2 Link to comment Share on other sites More sharing options...
ALTIMAX Posted December 21, 2020 Author Share Posted December 21, 2020 Hi ZachSaucier , thanks for your help ! I hadn't thought about the call function, it did the job well 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