Animation Problem - Directional inconsistency

I didn’t like the menu layouts/options afforded by wix, so I created my own using a box with a bunch of text buttons attached to it.

This custom menu is hidden on load. I have a menu button in the header that brings up the menu, and an ‘x’ button on the box that closes the menu. The menu appearing / disappearing is animated using the following:

Menu Appear
export function HeaderMenuButton_click(event, $w) {
let effectOptions = {
“duration”: 1500,
“delay”: 0,
“direction”: “top”
}
$w(‘#MenuBackgroundBox’).show(“fly”, effectOptions);
}

Menu Disappear
export function MenuCloseButton_click(event, $w) {

let effectOptions = {
“duration”: 1500,
“delay”: 0,
“direction”: “top”
}
$w(‘#MenuBackgroundBox’).hide(“fly”, effectOptions);
}

The above works fine as long as I have not scrolled down at all on my site. As soon as I scroll down, it’s like it throws the effectOptions out the window, and the menu animates in from varying points at the bottom of the screen, and at varying speeds.

I don’t understand why this is the case?

HI,
There is an issue with “top” direction, it is investigated. You can use “left” direction - it works as expected if scroll down .