Arrêtez le chargement de l'iframe après le défilement?

Question

J'ai une page avec un iframe ... Actuellement j'ai utilisé ce code pour charger iframe onscroll ....

Javascript:

function lazyLoad() { 
    for (var e = document.getElementsByClassName("lazy"), t = 0; t < e.length; t++) isInViewport(e[t]) && (e[t].src = e[t].getAttribute("data-src")) 
     } 
function isInViewport(e) { 
    var t = e.getBoundingClientRect(); 
    return t.bottom >= 0 && t.right >= 0 && t.top <= (window.innerHeight || document.documentElement.clientHeight) && t.left <= (window.innerWidth || document.documentElement.clientWidth) 
} 
function registerListener(e, t) { 
    window.addEventListener ? window.addEventListener(e, t) : window.attachEvent("on" + e, t) 
} 
registerListener("load", lazyLoad), registerListener("scroll", lazyLoad); 

HTML:

<iframe data-src='http://some-link.com' src='' class='lazy'/> 

Mais quand je faites défiler à nouveau même si légèrement, l'iframe est à nouveau chargé. Quelqu'un peut-il m'aider à créer iframe n'est pas chargé à nouveau après que je défile pour la deuxième fois? Je vous remercie!

DEMO: http://design-jarwo.blogspot.co.id/ et je vais l'utiliser sur mon blog www.kodejarwo.com

Answer 1

Vous devez supprimer l'écouteur d'événement de défilement après sa cuisson:

function onScroll() { 
    if (lazyLoad()) { 
     window.removeEventListener('scroll', onScroll); 
    } 
} 
function onLoad() { 
    lazyLoad(); 
} 
function lazyLoad() { 
    var loaded = false; 
    for (var e = document.getElementsByClassName("lazy"), t = 0; t < e.length; t++) { 
     isInViewport(e[t]) && (e[t].src = e[t].getAttribute("data-src")); 
     loaded = true; 
    } 
    return loaded; 
} 
function isInViewport(e) { 
    var t = e.getBoundingClientRect(); 
    return t.bottom >= 0 && t.right >= 0 && t.top <= (window.innerHeight || document.documentElement.clientHeight) && t.left <= (window.innerWidth || document.documentElement.clientWidth) 
} 
function registerListener(e, t) { 
    window.addEventListener ? window.addEventListener(e, t) : window.attachEvent("on" + e, t) 
} 
registerListener("load", onLoad), registerListener("scroll", onScroll);