zenscroll-plus

Rewrited and extended version of the original zenscroll https://github.com/zengabor/zenscroll

Usage no npm install needed!

<script type="module">
  import zenscrollPlus from 'https://cdn.skypack.dev/zenscroll-plus';
</script>

README

Zenscroll plus

Rewrited and extended version of the original zenscroll

Install

npm

npm i zenscroll-plus

yarn

yarn add zenscroll-plus

Use

import Zenscroll from 'zenscroll-plus';

const elContainer = document.querySelector('.scrollable');
const el = elContainer.querySelector('.inner-element');
const scroll = new Zenscroll(elContainer, 500, 16);
// 500ms to animate, 16px to offset
scroll.scrollToCenterOf(el); // scroll to center of container's element
scroll.scrollToElemY(el); // scroll to container's element only along the Y axis
scroll.scrollToElemX(el); // scroll to container's element only along the X axis
scroll.scrollToCenterOfY(el) // scroll to container's element ceneter only along the Y axis
scroll.scrollToCenterOfX(el) // scroll to container's element ceneter only along the X axis

For more methods you can read JSDoc in the zenscroll.js source file

If you want to use transpiled version, you must import module from zenscroll-plus/build/zenscroll.