lemehovskiy/scroller

VanillaJS plugin for detecting vertical scroll progress.

scroller

---

VanillaJS plugin for detecting vertical scroll progress.

Demo

Basic demo
Auto adjust scroll offset demo

🧐 About

VanillaJS plugin for detecting vertical scroll progress.

🏁 Getting Started

Installing

npm i @lemehovskiy/scroller

Scroller example

index.js

import Scroller from "@lemehovskiy/scroller";

const scroller = new Scroller(document.querySelector(".scroller-element"), {
  autoAdjustScrollOffset: true,
});
const progressEl = document.getElementById("progress");

if (progressEl) {
  scroller.progressChanged.on((progress) => {
    progressEl.innerHTML = "" + progress;
  });
}

index.html

<div id="progress"></div>
<div class="spacer"></div>
<div class="scroller-element"></div>
<div class="spacer"></div>

style.css

.spacer {
  min-height: 500px;
  background-color: aquamarine;
}
.scroller-element {
  min-height: 700px;
  background-color: azure;
}
#progress {
  position: fixed;
  top: 0;
  left: 0;
}