Studio Editor Request: Scrolling Inside Lightboxes and Hamburger Menus
Collecting votes
Currently, site visitors cannot scroll inside a lightbox or a hamburger menu container to see more of its content.
As a workaround, you can add a transparent container that's docked to the bottom with a negative margin. This creates content overflow inside the lightbox / menu container, which will allow visitors to scroll down.
To manually add the option to scroll:
- Select the lightbox / hamburger menu container.
- Add a container and make it transparent:
- Add any container from the Add Elements panel, attaching it to the Lightbox / Hamburger Menu Container.
- Click the Open Inspector arrow at the top right of the Editor.
- (In the Inspector) Scroll down to Design.
- Drag the slider under Background to 0% opacity.
- Dock the container to the bottom and "create" the content overflow:
- (In the Inspector) Scroll down to Position.
- Dock the container to the bottom.
- Add a bottom margin with a negative value (e.g. -15%).
Tip: The negative margin you should enter depends on the amount of content you have.
- Make the lightbox / hamburger menu container scrollable:
- Select the lightbox / hamburger menu container.
- Click the Open Inspector arrow at the top right of the Editor.
- (In the Inspector) Scroll down to Layout.
- Set the Overflow content to Scroll.
- Preview the site to see how it looks.
We are always working to update and improve our products, and your feedback is greatly appreciated.