JSPM

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

Responsive range slider library written in typescript and using web component technologies. Pure JavaScript without additional dependencies. It has a rich set of settings, including one and two pointers, a vertical slider, touch, mousewheel and keyboard support, local and session storage, and RTL support.

Package Exports

  • toolcool-range-slider
  • toolcool-range-slider/dist/toolcool-range-slider.min.js

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 (toolcool-range-slider) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

Tool Cool Range Slider

GitHub license GitHub package.json version npm NPM Featured on Openbase Twitter

Responsive range slider library written in typescript and using web component technologies. Pure JavaScript without additional dependencies. It has a rich set of settings, including any number of pointers (knobs), vertical and horizontal slider, touch, mousewheel and keyboard support, local and session storage, range dragging, and RTL support. The functionality of the library can be extended using plugins. The library core is 27 KB minified or 9 KB compressed (GZip).

Tool Cool Range Slider

Features

  • Responsive, touch, mousewheel, and keyboard support 📱
  • Range slider with any number of pointers (knobs).
  • Accessible via ARIA-attributes 🛡️
  • ES6 JavaScript + TypeScript.
  • No dependencies 🔓
  • Predefined themes as a standalone plugin 🎨
  • Images and SVG can be used as pointers.
  • Customizable with a large set of style attributes 🔧
  • Horizontal and vertical sliders support.
  • Based on web component technologies.
  • Allows programmatic attribute changes 💻
  • Bottom to top support.
  • Simple dynamic rendering after ajax requests or delays.
  • Disabled / enabled range slider (including API).
  • Possibility to disable only one pointer.
  • Support for local storage and session storage as a separate plugin 💾
  • Supports a list of individual values (discrete values).
  • Right to left (RTL) support 🌐
  • Text data support ✍️
  • Non-linear range slider 📉
  • Optional animation on panel click.
  • Works well with Bootstrap and other CSS frameworks 👍
  • No CSS conflicts due to web components.
  • Automatically generated labels as a standalone plugin.
  • Any number of sliders on one page.
  • Supports two (and more) pointers overlap, pointers max and min distance.
  • Supports range dragging.
  • The functionality of the library can be extended using plugins.
  • The library core is 27 KB minified or 9 KB compressed (GZip).
  • The range slide can be used in React and other frameworks.

License

MIT license

It can be used for free in any personal or commercial project 🎁