79398547

Date: 2025-01-30 00:54:37
Score: 0.5
Natty:
Report link

In my case this was caused by images using lazy loading, thus only loading when in view.

This fixed it for me, add this to the bottom of the script.

let resizeTimeout;

function refreshLenis() {
  clearTimeout(resizeTimeout); // Cancel previous resize calls
  resizeTimeout = setTimeout(() => {
    requestAnimationFrame(() => {
      lenis.resize(); // Recalculate dimensions inside requestAnimationFrame for smoother transitions
    });
  }, 300); // Adjust delay as needed
}

// Refresh Lenis when the page fully loads
window.addEventListener("load", refreshLenis);

// Also refresh Lenis when lazy-loaded images finish loading
document.querySelectorAll("img[loading='lazy']").forEach((img) => {
  img.addEventListener("load", refreshLenis);
});
Reasons:
  • Long answer (-0.5):
  • Has code block (-0.5):
  • Unregistered user (0.5):
  • Low reputation (1):
Posted by: nikolaj