Nada Posted January 20, 2020 Share Posted January 20, 2020 Hey guys! I have a problem with reverse function, It reverse all play animation which happened after click. document.addEventListener('DOMContentLoaded', function () { var menuitem__click = $('.submenu__item'), $document = $(document), action__zone = $('.action__zone'), counter = false, counter_uniqe = false, $click = $('.click'), menu_tween_1= new TimelineMax({ paused: true, reversed: true, align: 'sequence', }); //TweenMax.set ( $('.action__item'), { visibility: 'hidden' } ); menuitem__click.on('click', function() { var $this = $(this), id = $(this).attr('data-id'), $cont = $('.action__item[data-id="'+id+'"]'), $cont_item = $('.action__item[data-id="'+id+'"] .menu-holder__list .menu-holder__item'), $thisClick = ($cont + "Click"); menu_tween_1 .to('.action__zone', 0,{className:"+=active"}) .to('.action__zone', .01,{autoAlpha:"1",ease:Power1.easeOut}) //.to('.action__item', 0,{className:"-=active"}) //.to($cont, 0,{className:"+=active"}) .to('.menu-holder__bg', 0.8,{scaleX:1,ease:Power2.easeInOut}) .staggerFromTo($cont_item, 1.3,{autoAlpha:0,x:80},{autoAlpha:1,x:0 ,ease:Power2.easeInOut},.06); if($cont.length) { $('.action__item').removeClass('active'); $cont.addClass('active'); menu_tween_1.play(); } else { menu_tween_1.reverse(); } }); }); Link to comment Share on other sites More sharing options...
ZachSaucier Posted January 20, 2020 Share Posted January 20, 2020 Hey Nada and welcome to the GreenSock forums. From what I can tell, this is the expected behavior (i.e. what should happen). Think of timelines as a list of smaller animations. When you call menu_tween_1.to (creating a new tween/animation and adding it to the menu_tween_1 timeline) then later when you reverse the entire timeline those tweens/animations that you add to it should be reversed as well. What are you expecting to happen? Can you please create a minimal demo recreating the issue(s) that you're facing? It would greatly help us in helping you. P.S. We highly recommend GSAP 3. It's smaller, has a bunch of new features, and has a smoother API 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