@3dwayfinder/scrollarea

A vanilla JS scrollarea that supports touch, mouse and scrollwheel

Usage no npm install needed!

<script type="module">
  import 3dwayfinderScrollarea from 'https://cdn.skypack.dev/@3dwayfinder/scrollarea';
</script>

README

scrollarea

A vanilla JS scrollarea that supports touch, mouse and scrollwheel

Usage

let area = document.getElementById("scrollarea");
let sa = new ScrollArea(area);

CSS

Make the container fixed height, overflow hidden. And the scrollable container as big as needed. To show a scrollbar add some styles to

.sa-content-longer .sa-scrollbar {
    width: 1em;
    background-color: lightblue;
}

.sa-content-longer .sa-bar {
    width: 1em;
    background-color: antiquewhite;
}