Create a scroll-to-top button with scrollable ancestor detection and configurable position.
npx skills add https://github.com/jiaiyan/naive-ui-skills --skill n-back-top
Please help me install this Agent Skill. Skill: n-back-top Source: https://github.com/jiaiyan/naive-ui-skills/tree/main/components/n-back-top Command: npx skills add https://github.com/jiaiyan/naive-ui-skills --skill n-back-top
BackTop components solve long-page navigation by providing an always-available scroll-to-top button.
Create an n-back-top component instance in your template and tune its props to match your layout and UX requirements.
High-intent search queries and answers about installing and using this skill.
A scroll to top button provides an always-available control for long page navigation. You can add it to Vue projects by creating a back-top component instance in your template and tuning its props to match your layout and UX requirements.
Auto-detection of scrollable ancestor allows a back to top component to automatically identify the first scrollable parent container. This means the scroll-to-top button works without manually specifying which container the user is scrolling within.
Yes, you can control visibility based on a scroll threshold and configure the position on the page, such as adjusting the right and bottom offsets. This ensures the scroll to top button appears only when needed and fits your layout.
The back to top component supports custom content via slots, allowing you to replace the default button UI. It is designed for web development scenarios like documentation sites, dashboards, and product catalogs built with naive-ui.
You can target a specific container for your scroll to top button using the target container support feature. This lets you bind the scroll action to a particular scrollable area rather than relying solely on auto-detection of the first scrollable ancestor.
jiaiyanConfigure Naive UI internationalization with NConfigProvider and createLocale for Vue 3 apps.
Seth-arcManages Myelin platform routing, navigation guards, URL structure, and state preservation.
jiaiyanLoad more data automatically when users scroll to the bottom of Vue lists.
deomiarnImplement smooth scrolling for same-page anchor links in router-based web applications.
