BackToTop is a package with no dependencies to make simple "back to top" buttons.
Installing with npm:
npm i @axn/backtotopBackToTop makes use of ESM exports. Most bundlers can import the module directly like so:
import * as BackToTop from '@axn/backtotop';
const element = document.querySelector('#back-to-top');
const button = BackToTop.applyToElement(element, {
animationInDuration: 1000
});
// Destroy BackToTop when you're done
button.destroy();For a full example, see floating-button.html.
Enables BackToTop events on an element.
-
elementThe element to apply BackToTop to. -
optionsoptional-
yThresholdoptional Minimum scroll position in pixels before element appears. -
animationInDurationoptional Duration of fade-in animation in milliseconds. -
animationOutDurationoptional Duration of fade-out animation in milliseconds. -
scrollBehavioroptional Scrolling method to use. Possible values:auto,instant,smooth. -
animationInoptional Fade-in animation name. -
animationOutoptional Fade-out animation name.
-
When applyToElement() is first called, BackToTop injects it's own stylesheet inside <head> with
ID backtotop-style. This is to provide the default fade-in and fade-out animations.
See LICENSE