alexe100dra Posted September 22, 2021 Share Posted September 22, 2021 Hello everyone first of all, i'd like to apologize for my probably very easy question. I'm no coder, i just wanted to custom my website and i got hooked with coding, one thing leading to another, i discovered gsap, i find the syntax pretty easy to understand, i'm more stuck with the triggering the timeline. So i have 3 buttons each trigger a specific function. when i press one button, i want to reverse any other function that played before playing this one . So this code below works pretty well, but it is easy because i only have 3 different functions. i was wondering if there was a better syntax : "reverse any function that my have played before" rather than listing them like this : ingmvOpen.reverse(); nopackOpen.reverse(); $("#shipping-btn").click(function () { if ($(this).hasClass("menu-open")) { $(this).removeClass("menu-open"); shipOpen.reverse(); } else { $(".slidein-btn").not( $(this) ).each(function(){ $(this).removeClass('menu-open'); ingmvOpen.reverse(); nopackOpen.reverse(); }); $(this).addClass("menu-open"); shipOpen.play(); } }); and an optional question, i have to click on a button to reverse a timeline, how can reverse it by clicking anywhere on the page ? thank you very for your patience alex Link to comment Share on other sites More sharing options...
nico fonseca Posted September 22, 2021 Share Posted September 22, 2021 Hi @alexe100dra , welcome to the forum! 💚 The correct way to reverse a timeline is like you are doing it. Yes, you can do the code "more efficient" by using a loop for example, and checking isActive() and .reversed(): See the Pen f2f56f3b7d0613dce23a71cc0ca7713e by nicofonseca (@nicofonseca) on CodePen But this way to handle it is one way on a million, as your question is more related to JavaScript and not GSAP 😛 Btw, to check if anywhere on the screen was clicked you can do it like this: document.addEventListener("click", yourFunction); Happy tween! 😊 3 Link to comment Share on other sites More sharing options...
alexe100dra Posted September 22, 2021 Author Share Posted September 22, 2021 Hello thank you for your reply ! ok i understand it much better now ! and yes for use i need to learn JS ! ( though even if gsap is js i find the logic closer to CSS ...)) thanks for your help ! 1 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