scroll-percentage
v2.0.0
Published
get scrolled percentage of a scrollable element
Downloads
840
Readme
yarn add scroll-percentage
import { calculateScrollPercentage } from 'scroll-percentage'
Or attach this script
in your html
.
<script src="https://unpkg.com/[email protected]/dist/index.js"></script>
document.querySelector('.parent-elem').addEventListener('scroll',e => {
let scrollPercentage = calculateScrollPercentage(e.target)
console.log('scroll percentage', scrollPercentage)
})
// If the parent/scrolling element is `window`,
// then provide a second parameter - height of the child element.
// Which is basically - the element `window` is scrolling by -
let childElemHeight = document.querySelector('.child-elem').clientHeight
window.addEventListener('scroll', e => {
let scrollPercentage = calculateScrollPercentage(e.target, childElemHeight)
console.log('scroll percentage', scrollPercentage)
})
N.B: While calculating the height of child elemenet,
adjust the value with margin/padding size.