onReverseComplete On TimelineMax

[Arun]

Hi,

 

After upgrading from 3.1.1 to 3.2.6, onReverseComplete  is not getting triggered.

 

[ZachSaucier]

Hey Arun and welcome to the GreenSock forums! 

 

In my tests, onReverseComplete works just fine:

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

 

It must be something else going on in your project. Can you please create a minimal recreation of the issue on CodePen?

[Arun]

Hello Zach,

 

Below is my code where onReverseComplete is not working after upgrading from 3.1.1 to 3.2.6.

 

var FullNaviTL = new TimelineMax();
	FullNaviTL.pause();
	FullNaviTL.to('.mainSiteMenu', 0.5, {top:0, width:"100%", ease: Power4.easeOut,
		onComplete: function(){
			jQuery(".mainMenuHamburger").addClass("newColor");
		}, 
		onReverseComplete:function(){
			jQuery(".mainMenuHamburger").removeClass("newColor");
		}
	});
	FullNaviTL.to('.mainSiteMenu > menu > ul > li:nth-child(1)', 0.6, {opacity:1, y:35, ease: Power4.easeOut},'-=0.1')
	FullNaviTL.to('.mainSiteMenu > menu > ul > li:nth-child(2)', 0.6, {opacity:1, y:35, ease: Power4.easeOut},'-=0.4')
	FullNaviTL.to('.mainSiteMenu > menu > ul > li:nth-child(3)', 0.5, {opacity:1, y:35, ease: Power4.easeOut},'-=0.4')
	FullNaviTL.to('.mainSiteMenu > menu > ul > li:nth-child(4)', 0.5, {opacity:1, y:35, ease: Power4.easeOut},'-=0.3')
	FullNaviTL.to('.mainSiteMenu > menu > ul > li:nth-child(5)', 0.4, {opacity:1, y:35, ease: Power4.easeOut},'-=0.3');
	FullNaviTL.to('.mainSiteMenu .bottomText', 0.5, {opacity:1, y:-15, ease: Power4.easeOut},'-=0.3');

 

am i missing something ?

 

And this is how it's getting triggered

 

jQuery(".mainMenuHamburger").click(function(){
		jQuery(this).toggleClass('off on');
		if(jQuery(this).hasClass("on")){
			HamburgerTL.play();
			FullNaviTL.play();
		} else {
			//Close Subnavi
			var openEle = jQuery(".mainSiteMenu > menu > ul > li a i.on");
			if(openEle.length > 0){
				openEle.toggleClass('off on');
				gsap.timeline().to(openEle.parent("a").next("ul"), 0.5, {height:0, onComplete:function(){
					HamburgerTL.reverse();
					FullNaviTL.timeScale(2).reverse();
				}});
			} else {
				HamburgerTL.reverse();
				FullNaviTL.timeScale(2).reverse();
			};
		};
});

 

[ZachSaucier]

It's impossible to tell from that chunk of code. Please create a minimal working demo that shows the issue in CodePen. This thread can help you get that going:

 Also you should totally upgrade to GSAP 3's sleeker API! More details here: