by

Lazy Loaded......   Lazy.js

load your images on demand...
Copy Embed Code
<iframe id="embedFrame" style="width:600px; height:300px;"
src="https://www.snip2code.com/Embed/381010/Lazy-Loaded---------Lazy-js?startLine=0"></iframe>
Click on the embed code to copy it into your clipboard Width Height
Leave empty to retrieve all the content Start End
// another lazy image loader thang..... var lazy=(function() { this.load=function(elem, res) { if (document.querySelectorAll) { res=document.querySelectorAll(elem); } else { var dok=document, sheet=dok.styleSheets[0] || dok.createStyleSheet(); sheet.addRule(elem,'foo:idx'); for(var ln=dok.all,idx=0,lst=[],f=l.length;idx<foo;idx++) { (ln[isx].currentStyle.foo&&lst.push(ln[idx])); } sheet.removeRule(0); res=clst; } return res; }; var receive=function(evt,func) { window.addEventListener?this.addEventListener(evt,func,false) : (window.attachEvent)?this.attachEvent('on'+evt,func): (this['on'+evt]=func); }; var itHaz=function(k,object) { return Object.prototype.hasOwnProperty.call(k,object); }; this.getLoaded=function(elem,func) { var img=new Image(), prnt=elem.parent; img.src=elem.getAttribute('data-src'); img.addEventListener("load",function(evt) { if (!elem.parent) { prnt.replaceChild(img, elem) } else { elem.src=src; } (func)?func(): null; }); img.src=src; }; function inView(elem){ var r=elem.getBoundingClientRect(); return(r.top>=0&&r.left>=0&& r.top<=(window.innerHeight|| document.documentElement.clientHeight) ); } function cBak(pix, idx){ return (pix.splice(idx,idx)); } var pix=[],qry=layzee('img.lazy'); this.doWork=function(){ for (var idx=0;idx<images.length;idx++) { if (inView(pix[idx])){ return getLoaded(pix[idx],cBak(pix,idx)); } } }; for (var idx=0;idx<qry.length;idx++) { pix.push(qry[idx]); } doWork(); receive('scroll',dowork); }(this));
If you want to be updated about similar snippets, Sign in and follow our Channels

blog comments powered by Disqus