So I want to add a function that when I click a div it moves, but when I click something else it moves back to its original position, I want to use gsap here too. I tried using an if else statement but I didn't know want to put in here(The part where there is two stars):
let btnSide1 = document.querySelector('.button-side-one'),
btnSide2 = document.querySelector('.button-side-two'),
btnTop = document.querySelector('.button-top'),
btnBig = document.querySelector('.button-big');
if (btnSide1 = **active**) {
gsap.to(btnSide1, .5, { x: 3 })
} else {
gsap.to(btnSide1, .5, { x: 0 })
}
here is the codepen link for this: https://codepen.io/sowg/pen/GRvQxpN
I figured this out I used toggle class list for this,
Here is how it works:
// Variables
btnSide1.onclick = function () {
btnSide1.classList.toggle("activex1");
};
.activex1 { left: 30vmin !important }
So when I click on the div it moves position
You have a typo.
if (btnSide1 === active)