Tengo problemas con mi código Lazy Load:

HTML

 <div class="mapFrame mobileHide" > <iframe class="lazy" data-src="{eval var=$config.gisMapUrl}" id="mapIFrame" ></iframe> </div> ... <div class="mapFrame mobileHide" > <iframe class="lazy" data-src=="{eval var=$config.polUrl}" ></iframe> </div>

JavaScript

 document.addEventListener("DOMContentLoaded", function() { var lazyloadiFrame = document.querySelectorAll("iframe.lazy"); var lazyloadThrottleTimeout; function lazyload () { if(lazyloadThrottleTimeout) { clearTimeout(lazyloadThrottleTimeout); } lazyloadThrottleTimeout = setTimeout(function() { var scrollTop = window.pageYOffset; lazyloadiFrame.forEach(function(iframe) { if(iframe.offsetTop < (window.innerHeight + scrollTop)) { iframe.src = iframe.dataset.src; iframe.classList.remove('lazy'); } } ); }, 20); } document.addEventListener("scroll", lazyload); });

Funciona de maravilla cuando se carga la página; y los iframes no se cargan en absoluto hasta que me desplazo a ellos. El problema es... Una vez que me desplazo a los iFrames y los muestro. Utilizo la barra de desplazamiento para moverme hacia arriba o hacia abajo, el contenido de los iFrames sigue recargándose una y otra vez... Cada vez que muevo la barra de desplazamiento, se vuelve a cargar. Necesito parar una vez cargado y solo mostrar. Básicamente, una vez que la barra de desplazamiento toca un iframe, iframe carga el contenido, lo muestra y puedo seguir desplazándome sin que vuelva a cargar el contenido.

La recarga lleva demasiado tiempo, y también hay un foco dentro del contenido de los iframes, lo que hace que vaya a ese iframe en particular cada vez que presione la barra de desplazamiento y lo vuelva a cargar. Solo necesito tener el iframe para mostrar el contenido una vez que se carga, y puedo continuar desplazándome hacia arriba o hacia abajo sin recargarlo.

Intenté eliminar class="lazy", y elimina la clase, pero el contenido aún se vuelve a cargar cada vez que presiono la barra de desplazamiento. Intenté eliminar scrollTop, pero eso solo parece eliminar el contenido dentro de un iframe.

Estoy un poco oxidado con la codificación de javascript y se agradece la ayuda de cualquier persona, especialmente en la codificación de qué hacer a continuación. ¡Por favor ayuda!