Scroll Location
Show your visitor just how far they’ve scrolled down your page, giving them a sense of how far they’ve come and how far they have left to go.
- Give visitors a visual cue as to how far they've scrolled down your page.
- Adjust offset from top or bottom of browser at each breakpoint.
- Match the scroll indicator to fit in with your other content.
Example
Since the Documentation pages are built using our new Partitions stack, which is a fixed position style stack, Scroll Location cannot monitor the scrolling within Partitions. To show off Scroll Location we've built a simple example page separate from this documentation page.
Using Scroll Location
Indicator Bar
Height
Allows you to change the height of the scroll location indicator bar in order to adjust its visibility to the visitor.
Location
The Scroll Location stack will be affixed to the top or bottom of the browser so that the visitor can always see it. With this setting you can choose whether you’d like it to be placed at the top or bottom of the browser window.
Offset
Allows you to adjust the offset of the scroll location, pushing it out from either the top or bottom of browser a set distance. This can be adjust at each of the three breakpoints.
Style
Allows you to choose whether to use a solid color or gradient for your scroll location indicator bar. Depending on your choice you will be presented with the appropriate color pickers for styling your indicator.
Bar Container Color
Allows you to adjust the background color of the container in which the indicator resides.
Bar Container Inset Shadow
Enabling this feature will add an inset shadow to your bar container making the stack appear to be inset on your page.
Scrollability
The Scroll Location stack's functionality is based around scrolling the browser window itself. Stacks like the Partitions stack, which don't allow the browser itself to scroll, but instead its inner contents scroll by itself, will not allow the Scroll Location stack to function. So keep this in mind when building your pages — the Scroll Location stack will not work within the Partitions stack.