Image lazy loader
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 

10 lines
924 B

/*!
* Echo
* @version 1.0.0
* @author Todd Motto http://toddmotto.com
* Project: https://github.com/toddmotto/echo
*
* Raw JavaScript lazy-loading images with HTML5 data-* attributes.
* Copyright 2013. MIT licensed.
*/
window.echo=function(a,b){"use strict";var c=function(a){this.elem=a,this.render(),this.listen()},d=[],e=function(c){var d=c.getBoundingClientRect();return(d.top>=0&&d.left>=0&&d.top)<=(a.innerHeight||b.documentElement.clientHeight)},f=function(a,b){a.src=a.getAttribute("data-echo"),b&&b()},g=function(a,b){-1!==d.indexOf(a)&&d.splice(b,1)},h=function(){for(var a=0;a<d.length;a++){var b=d[a];e(b)&&f(b,g(b,a))}};c.prototype={init:function(){d.push(this.elem)},render:function(){b.addEventListener?b.addEventListener("DOMContentLoaded",h,!1):a.onload=h},listen:function(){a.onscroll=h}};for(var i=b.querySelectorAll("img[data-echo]"),j=0;j<i.length;j++)new c(i[j]).init()}(window,document);