Dot Demo
This page demonstrates the starlight-glide plugin in action with the dot desktop preset and spring physics Spring Physics. Scroll down to see the glowing dot bounce along the track as you progress. We’ve also overridden the indicator color on this page.
Bouncy Movement
Section titled “Bouncy Movement”- Spring Physics: Notice the slight bounce when you scroll between sections!
- Minimalist Design: The dot tracks your vertical progress without expanding horizontally.
- Custom Color: We used the frontmatter config to change the color to red for this specific page.
Deep Nesting Test
Section titled “Deep Nesting Test”This section tests how the dot handles nested sections.
Sub-heading Level 3 (A)
Section titled “Sub-heading Level 3 (A)”Since the dot doesn’t move horizontally, it stays on the track perfectly aligned.
Sub-heading Level 3 (B)
Section titled “Sub-heading Level 3 (B)”It smoothly travels down to the active heading.
Animation Features
Section titled “Animation Features”The dot indicator uses transforms to ensure high-performance animation.
The spring physics configuration adds a dynamic, lively feel by slightly overshooting the target and snapping back.
A subtle box-shadow gives the dot a premium glowing appearance.
Conclusion
Section titled “Conclusion”Try mixing and matching different presets in your frontmatter!
Feedback
Section titled “Feedback”Let us know which preset you prefer.
Custom Colors
Section titled “Custom Colors”Experiment with any CSS valid color string in the indicatorColor field.