getScrollbarWidth
Category Sensors
Gets the scrollbar width of an element.
This works in browsers that do not use absolute positioning for scrollbars, such as Chrome on desktop.
Demo
Current Width : X = 0px | Y = 0px
Scrollbar thickness ?
Overflow axis ?
Usage
<script>
import { getScrollbarWidth } from '@sv-use/core';
let el = $state();
const width = getScrollbarWidth(() => el);
</script>
<div bind:this={el} style="overflow-y: scroll"></div>
Type Definitions
import type { CleanupFunction, MaybeGetter } from '../__internal__/types.js';
type GetScrollbarWidthReturn = {
readonly x: number;
readonly y: number;
cleanup: CleanupFunction;
};
/**
* Gets the scrollbar width of an element.
* @param element The element on which to get the scrollbar width from.
* @see https://svelte-librarian.github.io/sv-use/core/get-scrollbar-width
*/
export declare function getScrollbarWidth(element: MaybeGetter<HTMLElement | null | undefined>): GetScrollbarWidthReturn;
export {};