Overview Official Website

Overlayscrolbar does only one thing: replace the browser's default scrollbar with a custom CSS-styled one without losing performances.

Add Package
npm i overlayscrollbars overlayscrollbars-svelte --save
Import Package
import 'overlayscrollbars/overlayscrollbars.css';
import { OverlayScrollbars } from 'overlayscrollbars';
Remove Package
npm remove overlayscrollbars overlayscrollbars-svelte or you can remove package by removing specific package from package.json
Options

const options = {
    scrollbars: {
        visibility: 'auto', // You can adjust the visibility ('auto', 'hidden', 'visible')
        autoHide: 'move', // You can adjust the auto-hide behavior ('move', 'scroll', false)
        autoHideDelay: 100,
        dragScroll: true,
        clickScroll: false,
        theme: 'os-theme-light',// or 'os-theme-dark'
        pointers: ['mouse', 'touch', 'pen']
    }
};


onMount(() => {
    const menuElement = document.querySelector('#vertical-menu');
    OverlayScrollbars(menuElement, options);
}
)
                                        
© Skote.