Forced to Care About Internet Explorer: lazy loading
Posted by
If you work in the public sector you’ll be forced to care about IE and especially speed and as is the public sector you need to spend as little time as possible time on any project.
So we tried every lazy load library we could find and consistently found issues with all of them using modern Javascript so I decided to just make a simple script using old Javascript and it just works
var replaceSrc = function () { x = document.getElementsByClassName('lazy-load-me'); for (i = 0; i < x.length; i++){ if (x[i].getBoundingClientRect().top < window.innerHeight) { img = x[i] if(window.innerWidth < 850 && x[i].getAttribute('mobi-src') != null){ lazySRC = x[i].getAttribute('mobi-src'); }else{ lazySRC = x[i].getAttribute('desk-src'); } if(x[i].tagName == 'VIDEO'){ x[i].canPlayType("video/mp4"); x[i].src = lazySRC; x[i].load(); x[i].onload = x[i].play(); x[i].classList.remove("lazy-load-me"); }else{ x[i].src = lazySRC; x[i].classList.remove("lazy-load-me"); } } } }; replaceSrc(); window.addEventListener('scroll', replaceSrc, false);
Leave a Reply