How to stop buttons from showing as though hovered/interacted with when used for jump links

[NMWeb]

I have a row on my page with an ID of #anchor and further down the page I have a button that navigates to #anchor.

The button works as expected in terms of navigation (the user is correctly navigated to the row with the ID of #anchor) but the button always displays as though it is being hovered over or interacted with. If the button is placed above the row with the ID of #anchor it displays normally (shows non-hover formatting until you hover over it) but if the button is below the row with the ID of #anchor it shows the hover/interaction formatting.

For various menu elements there is a configuration section labeled “Active Links Setup” in which similar functionality can be turned on or off. However I can’t figure out how to do the same with buttons using the tools & configuration settings in the theme.

Before I explore using CSS or JS to force the buttons to behave normally regardless of where they are located on the page I wanted to check if there was a way to do this using the delivered Theme Pro functionality.

[ruenel]

Hello @NMWeb,

Thanks for writing in!

The button element only have a base and interaction setting. Take for example the background color of the button element, you will have this:

The active status of the button will be using the base while the hover will use the interaction settings.

Hope this helps.