JSPM

  • ESM via JSPM
  • ES Module Entrypoint
  • Export Map
  • Keywords
  • License
  • Repository URL
  • TypeScript Types
  • README
  • Created
  • Published
  • Downloads 1948523
  • Score
    100M100P100Q220338F
  • License MIT

A tool to get browser's scrollbars width.

Package Exports

  • @xobotyi/scrollbar-width

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (@xobotyi/scrollbar-width) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

@xobotyi/scrollbar-width

A tool to get browser's scrollbars width.

Build status NPM version License Types definition

× LIVE EXAMPLE ×


❤️Please consider starring this project to show your love and support.🙌

Installation

npm install @xobotyi/scrollbar-width
# or via yarn
yarn add @xobotyi/scrollbar-width

INSTALLATION NOTE:
This lib is written in TypeScript and delivered with both, transpiled and untranspiled ES versions:

  • main field of package.json is pointing to transpiled ES5-compatible version with CJS modules resolution;
  • module field is pointing to transpiled ES5-compatible version with ES modules resolution;
  • esnext field is pointing to the ESnext version with ES modules resolution;

OR you can add it directly to your site via the <script /> with help of UNPKG:

<script src="https://unpkg.com/@xobotyi/scrollbar-width/dist/index.min.js"/>

After that you will be able to use the function as xobotyi.scrollbarWidth()

Usage

import { scrollbarWidth } from '@xobotyi/scrollbar-width';

scrollbarWidth(); // for most browsers will return 17 and 0 for SSR environment
// or undefined if to call it too early [read below]

This function caches the value to avoid increased resources usage. In case you want to get re-calculated value - pass true as first call parameter.

NOTE:
Function will return undefined in case being called before the DOM is ready.

  • react-scrollbars-custom — The best React custom scrollbars component. Allows you to customise scrollbars as you like it, crossbrowser!
  • zoom-level — A comprehensive cross-browser package that allow you to determine page's and element's zoom level.
  • @xobotyi/should-reverse-rtl-scroll — A tool detecting if RTL scroll value should be negative.