Smooth animation onClick button

Ask the community
,
11

No problem :slight_smile:
but when i see the website in preview mode, the animation start without clicking the button.

import wixAnimations from 'wix-animations';

// Initialize the timelines;
const t1 = wixAnimations.timeline();
const t2 = wixAnimations.timeline();

// Define the animations
t1.add($w("#box40"), { opacity: 0, duration: 350 });
t1.add($w("#box39"), { opacity: 1, duration: 350 });

// Hide the box that should be hidden by default.
t1.play();

// Initialize animations
const animation = {
    state: 'hidden',
    play: () => {
        t1.reverse();
        t2.play();
        animation.state = 'shown'
    },
    reverse: () => {
        t1.play();
        t2.reverse();
        animation.state = 'hidden';
    }
}

// Define an event handler
$w('#button24').onClick(() => {
    animation.state === 'hidden' ? animation.play() : animation.reverse();
})