nav[aria-label="Primary Navigation"] { padding: 0; & ul { list-style: none; width: 100%; display: flex; flex-direction: row; justify-content: start; align-items: start; gap: 30px; padding: 0; & li { margin: 0; } & ul li { list-style: none; } } }

Is it possible to create a scrolling page experience with static menu navigation?

lst

Is it possible to create a scrolling page experience with static menu navigation (similar to the example website below) within Experience Builder?

https://tfnsw.ee.alytics.com/mamre-road-upgrade-stage-1/study/Hydrology_and_flooding

I've been through all the documentation and tutorials and can't get an appropriate combination of widgets/blocks/screen groups to work. I'm specifically having trouble with the menu component and keeping it fixed or static so it doesn't scroll with the rest of the content. I feel like I need the inverse of the screen group template i.e. a scrolling 'main stage' with a fixed/static menu allowing navigation to different parts of the main stage.

So far I've looked at combinations of the following elements without (complete) success:

Button Widget
Row Widget
Column Widget
Block
Screen Group
Section Widget (with navigation)
Menu Widget

Feel like I'm missing something obvious.

Find more posts tagged with

ArcGIS Online

Accepted answers

jcarlson

Another option is to use the Pin setting in a widget. For example, I'll set my menu widget to be pinned to the right-center position.

It won't be obvious in the editing view, but when you preview your experience, it should behave like you expect.

All comments

lst

Brilliant! This is exactly what I was looking for. I'm new to the system and was sure it would be something simple I was missing.

lst

Thanks, a good suggestion and I forgot to mention I'd played around with the header already. Ideally I'd like a navigation menu on the left side of the screen though, which you can't do with the header.

jcarlson

Another option is to use the Pin setting in a widget. For example, I'll set my menu widget to be pinned to the right-center position.

It won't be obvious in the editing view, but when you preview your experience, it should behave like you expect.

JonathanMcDougall

@lst

One option, using a scrolling template, would be to enable Header with the option to fix to top of screen, then add in widgets to create your menu options to that header, resizing header as you see fit.

Join the Conversation

Signed in members can post, follow updates, and more. New here? Register a free account.

Quick Links

Community Help
Find useful guides, FAQs, and documents to help you navigate and make the most of Esri Community.