Can anyone help me integrate progress functionality with Locomotive Scroll using JavaScript?
Check out this code snippet from Locomotive Scroll that calculates the percentage of pages scrolled:
const scroller = new LocomotiveScroll({
el: document.querySelector('[data-scroll-container]'),
smooth: true
})
const bar = document.querySelector('.progress-wrap path');
scroller.on('scroll', ({ limit, scroll }) => {
const progress = scroll.y / limit.y * 100
bar.style.width = `${progress}%`
console.log(`${progress}%`)
})
I'm unsure about the specific code to replace in this section:
bar.style.width = `${progress}%`
For the full version of JavaScript code, it can be found beneath the locomotive scroll code here: CodePen Link