$w.onReady(function () {
initHamburgerMenuAnimations();
});
function initHamburgerMenuAnimations() {
const hamburgerMenu = $w('#hamburgerMenuMainContainer');
const menuContentWrapper = $w('#hamburgerMenuContentWrapper');
const menu = $w('#hamburgerMenuMenu');
//*** Add default elements classes ***//
menuContentWrapper.customClassList.add('clip-menu-box');
menu.customClassList.add('custom-menu-animation');
$w('#openHamburgerMenuBtn').onClick(() => { openMenu() });
$w('#closeHamburgerMenuBtn').onClick(() => { closeMenu() });
const openMenu = () => {
hamburgerMenu.open();
menu.customClassList.add('entrance');
//*** Menu reveal animation ***/
setTimeout(() => {
menuContentWrapper.customClassList.add('expand-clip-menu-box');
}, 20);
}
const closeMenu = () => {
menuContentWrapper.customClassList.remove('expand-clip-menu-box');
//*** Menu exit animation ***/
menu.customClassList.add('exit');
setTimeout(async () => {
await hamburgerMenu.close()
menu.customClassList.remove('exit', 'entrance');
}, 350);
}
}
One Red Cow - Advertising Agency
top of page
bottom of page
