"Change style" interaction doesn't work on menu items with a page link navigation

Daniel Engelberg shared this problem 7 years ago
Solved

I'm using a horizontal navigation menu in a template. When the user clicks on a (top-level) menu item, I want the currently selected menu item to change style to show that it is currently selected. So I tried putting two actions on each menu item: a navigation action and a change style action. However with this approach, the menu item just flickers briefly to the requested style (at the moment of the click) and then goes back to the default style. The only way to keep the style displayed is to create a variable for the currently selected menu item, set the variable on click of the menu item, and use a page load interaction to apply the style conditionally based on the value of the current menu item variable. Although it works, it is a laborious work-around.

Comments (3)

photo
1

Hi,


What you did is the correct way of doing it.


The styles are reset when the new screen is loaded after a navigation event.


Regards,

photo
1

Ok... thanks! On this topic, it would be very useful to have a section in the template properties to specify the style of states such as selected, unselected, and disabled.

photo
1

Please, can someone make a short tutorial on this topic.


How can I do this?