Jump to content
Search Community

SYNTAX QUESTION

alexe100dra test
Moderator Tag

Recommended Posts

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

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! 😊

  • Like 3
Link to comment
Share on other sites

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 account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...