Lottie code not working

Ask the community
3

Hi Noah! Yeah sure thing!
Added it below and also an additional screenshot of it with notes if that helps.
You’ll see that I’ve set the Lottie element to .stop(); and commented out the trigger for it to play. However, the result is that it just plays regardlessly (so, it’s ignoring the stop() function.

Wasn’t aware of the Velo forum, thanks for pointing that out!

Full code on my current site

import wixAnimations from 'wix-animations';
import wixWindow from 'wix-window';

let navTimeline;
let screenSizeInterval;


$w.onReady(function () {

    //Lottie does not play yet 
    $w('#lottieExample').stop();
    
    $w('#navOpenDiap').show();
    $w('#navOpen').hide();
    $w('#nav').style.backgroundColor = "rgba(224,235,82,0)";

// SIDE MENU ITEMS HOVERS
    $w('#linkFilms').onClick(() => {
            $w('#nav').style.backgroundColor = "rgba(10,8,8,1)";
            $w('#navOpen').show();
            $w('#navOpenDiap').hide();
            clearInterval(screenSizeInterval);
            navTimeline = wixAnimations.timeline().add($w('#nav'), { x: 0, duration: 300, easing: 'easeInOutCubic' }).play();
            
            open = false;
        
    })


//CLOSE / OPEN SIDE MENU
    let open = false;
    $w('#navClick').onClick(() => {
        if (open == false) {
            screenSize();
            screenSizeInterval = setInterval(screenSize, 700)
            open = true;
        } else {
            $w('#nav').style.backgroundColor = "rgba(10,8,8,1)";
            $w('#navOpen').show();
            $w('#navOpenDiap').hide();
            clearInterval(screenSizeInterval);
            navTimeline = wixAnimations.timeline().add($w('#nav'), { x: 0., duration: 300, easing: 'easeInOutCubic' }).play();
            
            open = false;
        }
    })

    function screenSize() {
        wixWindow.getBoundingRect()
            .then((windowSizeInfo) => {
                let windowWidth = windowSizeInfo.window.width;
               navTimeline = wixAnimations.timeline().add($w('#nav'), { x: -(windowWidth * 0.9502), duration: 200, easing: 'easeInOutCubic' }).play();
               $w('#nav').style.backgroundColor = "rgba(224,235,82,1)";
                     $w('#navOpenDiap').show();
                      $w('#navOpen').hide();

            });
    }

   // $w("#lottieExample").onViewportEnter( (event) => {
   // $w('#lottieExample').play();
   // });

});

1469×1170 156 KB