Untitled
unknown
javascript
2 years ago
2.5 kB
16
Indexable
// ====================== YOU CAN IGNORE THIS ============== // ========================================================= // Easing function for smooth scrolling (quadratic) Math.easeInOutQuad = function (t) { return t < 0.5 ? 2 * t * t : -1 + (4 - 2 * t) * t; }; // Smooth Scroll function smoothScroll(targetY, duration, easingFunction) { const startingY = window.pageYOffset; let startTime = null; function scrollStep(timestamp) { if (!startTime) startTime = timestamp; const elapsed = timestamp - startTime; const progress = Math.min(elapsed / duration, 1); const ease = easingFunction(progress); window.scrollTo(0, startingY + (targetY - startingY) * ease); if (progress < 1) { requestAnimationFrame(scrollStep); } } requestAnimationFrame(scrollStep); } // Example usage with easeInOutQuad const easeInOutQuad = t => t < 0.5 ? 2 * t * t : -1 + (4 - 2 * t) * t; // ===================================================================== // ============= THIS IS WHERE YOU START LOOKING ======================= function performScrolls() { // Scroll 300 pixels down smoothly with cubic bezier easing in 1000 milliseconds (1 second) smoothScroll(window.pageYOffset + 200, 1000, easeInOutQuad); setTimeout(() => { smoothScroll(window.pageYOffset + 200, 800, easeInOutQuad); setTimeout(() => { smoothScroll(window.pageYOffset + 200, 800, easeInOutQuad); setTimeout(() => { smoothScroll(window.pageYOffset + 200, 800, easeInOutQuad); setTimeout(() => { smoothScroll(window.pageYOffset + 200, 800, easeInOutQuad); setTimeout(() => { smoothScroll(window.pageYOffset + 200, 800, easeInOutQuad); // add another /* setTimeout(() => { smoothScroll(window.pageYOffset + 200, 800, easeInOutQuad); }, 2000); after smoothscroll */ }, 2000); // ... }, 2000); // ... }, 2000); // you get the picture }, 2000); // between 2nd and 3rd }, 2000); // between 1st and 2nd } setTimeout(() => { // Start the sequence of scrolls performScrolls(); }, 10000); // delay after launch, to let you start recording, minimize console and etc.
Editor is loading...
Leave a Comment