animate-overflow-scroll-to

animate-overflow-scroll-to

Smooth element scroll to position with requestAnimationFrame and Tween.

Fork notice

This is a fork of scroll-to

This fork does the following:

• expands the API by enabling animated / smooth scrolling for any element that has the scrollTop / scrollLeft properties along with the CSS style overflow: scroll enabled.
• adds server side rendering support via @hampusohlsson

Installation

npm i animate-overflow-scroll-to

API

scrollTo(domNode, x, y, [options])

Scroll a domNode to the given point x, y with the given options:

• ease easing function defaulting to "out-circ" (view ease for more)
• duration animation duration defaulting to 1000

var scrollTo = require('animate-overflow-scroll-to');

// scrollDiv should have overflow: scroll set in its style
var scrollDiv = document.getElementById('scrollDiv')

scrollTo(scrollDiv, 500, 1200, {
  ease: 'out-bounce',
  duration: 1500
});

Example

You should be able to run the example.html file to try it out.

Building

Building should not be necessary to use it as a module.

If for whatever reason, you need to build the file (eg forking this project and updating the example.html), you need to install component to build the bundle.

component is outdated, but PRs are welcomed to switch the build to something else like browserify or webpack.

$ npm i
$ npm install -g component
$ component build

License

MIT