Programmatically Scroll
Lesser Known Trick
js
// Set the desired scroll speedconst scrollSpeed = 0.2;
// Set the delay before starting the scroll (in milliseconds)const startDelay = 5000;
// Calculate the total distance to scrollconst totalScrollDistance = document.documentElement.scrollHeight - window.innerHeight;
// Calculate the scroll duration based on the scroll speed and total distanceconst scrollDuration = totalScrollDistance / scrollSpeed;
// Get the start timelet startTime = null;
// Function to handle the scrolling animationfunction scrollAnimation(currentTime) { if (startTime === null) { startTime = currentTime; }
const elapsedTime = currentTime - startTime; const scrollPosition = (elapsedTime / scrollDuration) * totalScrollDistance;
window.scrollTo(0, scrollPosition);
if (elapsedTime < scrollDuration) { window.requestAnimationFrame(scrollAnimation); }}
// Function to start the scrolling animation after the specified delayfunction startScrolling() { setTimeout(() => { window.requestAnimationFrame(scrollAnimation); }, startDelay);}
// Call the startScrolling function to begin the scrolling animation after the delaystartScrolling();Backlinks (1)
Comments (0)