Implementing wix animation in dev mode

I'm trying to create a menu for a Wix website. It's supposed to slide in from the right when the user clicks on the hamburger icon and slide out from the left when the user clicks on the X.

Here is my code so far:

// #verticalMenu1 is the menu, #text15 is the X, #iconButton4 is the hamburger.
// I don't know how I can change the IDs either, I'm new to Wix.

import wixAnimations from 'wix-animations';

$w.onReady(function () {
    var timeline = wixAnimations.timeline();

    $w("#verticalMenu1").hide();
    $w("#text15").hide();

    $w("#iconButton4").onClick(function() {
        $w("#verticalMenu1").show();
        timeline.add($w('#verticalMenu1'), {y: 20, duration: 1900, easing: 'easeInSine'})
        $w("#iconButton4").hide();
        $w("#text15").show();
    });

    $w("#text15").onClick(function() {
        $w("#verticalMenu1").hide();
        $w("#iconButton4").show();
        $w("#text15").hide();
    }); 

});

If anyone knows Wix well and could help me, that would be awesome! Thanks! :)