Hi friend.

Can you explain better? Your idea is to trigger the menu on hover?

Kind regards

Hello Friend,

Can you please check this link I think it will help you.

https://www.outsystems.com/forums/discussion/37091/beautiful-menu/

and Dublin theme also have good side menu.

you can use this forge component also https://www.outsystems.com/forge/component-overview/202/dynamic-menus

Make a nice day!!

Kind Regards,

Ajit kurane

Hey there

First what I did was, created a container that will be the container that will be the space that I am going to do the hover to open the menu.

Then on that container, I inserted the event onmouseover, what does that mean?

when I do a hover on the container it will execute an action.

That action, i have a javascript that with the id of the LayoutWrapper will add the class menu-visible to open the menu

To close the menu, I put an event when the user gets out of the menu and goes to the main

It will be the same to open the menu, but in this case, I will use the remove to remove the class .menu-visible

document.getElementById($parameters.MenuId).classList.remove('menu-visible')

The CSS that I did to the container that I am going to do hover is:

.open-menu{
    position: absolute;
    background: transparent;
    height: 100%;
    padding: 1.5%;
    top: 0;
    z-index: 1;
}

Also, I needed to put this CSS:

.layout-side .app-menu-content{
    z-index: 110;
}

Because the z-index of the main content was bigger than the one of the menu, and that was making the menu close even if I was hovering the menu...

The .open-menu is just a class that I gave to the container.

You can try here and give me some feedback:

https://marcio-carvalho4.outsystemscloud.com/MenuOpenOnHover/Products?_ts=637657033642018495

I also shared my OML

Kind Regards,

Márcio