LIVE SITE

Restaurant Menu Side Bar

Hover, All interactions

import wixAnimations from 'wix-animations';


$w.onReady(function () {

    wixAnimations.timeline()

        .add($w('#sidemenu'), { x: 175, duration: 200 })

        .play()


});

let menuStacks = ('#stack1, #stack2, #stack3, #stack4, #stack5, #stack6, #stack7')

let menuOpen = false;

let fadeOptions = {

    'duration': 300

}

export function hoverBox_mouseIn(event) {

    if (menuOpen === false) {

        wixAnimations.timeline()

            .add($w('#sidemenu'), { x: 0, easing: 'easeInSine', duration: 300 })

            .play()

    }

}


export function hoverBox_mouseOut(event) {

    if (menuOpen === false) {

        wixAnimations.timeline()

            .add($w('#sidemenu'), { x: 175, easing: 'easeInSine', duration: 300 })

            .play()

    }

}


export function hoverBox_click(event) {

    if (menuOpen === false) {

        $w('#expander').expand();

        $w(menuStacks).expand();

        $w('#shadowBox').show('fade', fadeOptions);

        menuOpen = true

    } else {

        $w('#expander').collapse();

        $w(menuStacks).collapse();

        $w('#shadowBox').hide('fade', fadeOptions);

        menuOpen = false

    }

}


export function shadowBox_click(event) {

    wixAnimations.timeline()

        .add($w('#sidemenu'), { x: 175, easing: 'easeInSine', duration: 300 })

        .play()

    $w('#expander').collapse();

    $w(menuStacks).collapse();

    $w('#shadowBox').hide('fade', fadeOptions);

    menuOpen = false

}

Explore more Hover interactions 

Appearing Hot Dog

Jonathan Tsodikovitch

Shop Now

Appearing Hot Dog

Jonathan Tsodikovitch

Shop Now

Add a Title

Add a Title

Tags

Sites on X | © 2021 made with ❤️ on Editor X.