Instructions

Copy the code below and paste it into the before </body> tag.

<script>

// Replace the this class with the class of the text element where you would like to display the percentage.
let scrollText = document.querySelector('.your-class');

// This function is calculating the percentage of the current position.
function getScrollPercent() {
    var h = document.documentElement,
        b = document.body,
        st = 'scrollTop',
        sh = 'scrollHeight';
    return (h[st] || b[st]) / ((h[sh] || b[sh]) - h.clientHeight) * 100;
}

// This updates the text with the percentage of the function above.
window.addEventListener("scroll", () => {
	let currentScroll = parseInt(getScrollPercent());
	scrollText.textContent = currentScroll;
});

</script>

Copy Code