Skip to content
⚓️ Smoothly scroll to #anchors
TypeScript HTML JavaScript
Branch: master
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
source
.gitignore
.npmignore
LICENSE
README.md
example.html
package.json
rollup.config.js
tsconfig.json
types.d.ts
yarn.lock

README.md

anchor-scroller

⚓️ Smoothly scroll to #anchors

Features

  • ... Scrolls to anchors
  • Stops scrolling if the user scrolls
  • Doesn't try to scroll past the end
  • It's only 1.5kb in size (900 bytes gzipped 😆)
  • Uses requestAnimationFrame for smooth animation

Quickstart

Node with a module bundler

npm install anchor-scroller --save
const AnchorScroller = require("anchor-scroller");
AnchorScroller();

Browser

<script src="https://unpkg.com/anchor-scroller@2.0.1/distribution/AnchorScroller.js"></script>
<script>AnchorScroller()</script>

Check out the wiki for more info.

Configuration

You can pass the instance an options object to tweak it's behavior. The simplest options are class and checkParent.

AnchorScroller({
  "class": "scroll", // will make it only react on elements with a "scroll" class.
  checkParent: true // will make it check the parent element, if the clicked element didn't match the criteria.
});

The more in-depth usage guide also has documentation on all options and methods.

You can’t perform that action at this time.