@lemehovskiy/scroller
TypeScript icon, indicating that this package has built-in type declarations

0.2.7 • Public • Published

scroller

Status GitHub Issues GitHub Pull Requests License


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;
}

Package Sidebar

Install

npm i @lemehovskiy/scroller

Weekly Downloads

0

Version

0.2.7

License

MIT

Unpacked Size

11.1 kB

Total Files

5

Last publish

Collaborators

  • lemehovskiy