At the top of the 'Gallery | C' page there’s an image grid that’s made out of state buttons. This article will go over how to control the responsive height, the hover effects, and how to link state buttons.
Responsive Height
The images take up 66% of the browser height. In order for responsive height to work, make sure the Responsive Height widget is applied to the master page and that the master page is applied to the Gallery page.
The image on the left has rh66 applied to it, and each of the images on the right have rh22 applied to it (22 * 3 = 66).
To change the height of the buttons, make sure you specify the percentage of the browser that you want the button to fill. For example, if you only wanted two buttons on the right instead of three, you could change the tooltip on the state buttons to rh31.
Hover Effects
To change the hover effects, just click on the text frame within the state button and the change the state to rollover to make changes. The image scroll effect was created by changing the positioning of the image.
Link State Buttons
To link state buttons to a part of the page, select the state button, go to the hyperlinks dropdown, and select a link.
To link to a section of the page, you have to place anchors. Just tap ‘a’ on your keyboard and place the anchor on the page. Give it a name.