Add custom direction to automation, show() hide() !??

Hey guys, I’m stuck here, help somebody? :slight_smile:
So I’m trying to have my menu slide in and out, the menu is a container box with my menu attached to it, inside the box. The box is called #box1
I have a square shape with a menu hamburger icon in it called #shape5
So what I’m trying to do is:
Menu SLIDES IN when mouse hovers a shape and
Menu SLIDES OUT when mouse exits the container box

If I don’t assign any automation to my shape in the regular Editor and I use the show(“SlideIn”) & hide(“SlideOut”)
it works perfctly… except the default direction is “From Left” and I need “From Right” :confused:
So In order to have it start “From Right” I assign to my container an Slide In automation from the Editor and then the problem begins: It slides in but doesnt slide out…

And here is my code:
export function shape5_onMouseIn(event, $w) {
$w(“#box1”).show(“slideIn”);
}
export function box1_onMouseOut(event, $w) {
$w(“#box1”).hide(“slideOut”);
}
Although the menu slides in very well when I hover shape, when OnMouseOut occurs, the menu doesn’t slide out, it just disappears, without any animation. Poof… no slick slide out.
Anyone knows how to fix this?
By the way here is a website with the feature: www.artbridge.fr
Thanks!

1 Like

Hey it seems you could make it to work after checking it out right now on yout website, how did you achieve it? That menu animation looks really good.

@Enhanced the website is not mine! but it shows what am trying to achieve… looks good thought! right?

Oh my bad, lol - Ya looks really good!
At the moment I believe we can’t add custom animation attributes :frowning: I think it will be added in the future.

But if there’s a way to do it right now someone please help! \o/

1 Like