/** * jQuery Unveil * A very lightweight jQuery plugin to lazy load images * http://luis-almeida.github.com/unveil * * Licensed under the MIT license. * Copyright 2013 Luís Almeida * https://github.com/luis-almeida */ ;(function($) { $.fn.unveil = function(threshold, callback) { var $w = $(window), th = threshold || 0, retina = window.devicePixelRatio > 1, attrib = retina? "data-src-retina" : "data-src", images = this, loaded; this.one("unveil", function() { var source = this.getAttribute(attrib); source = source || this.getAttribute("data-src"); if (source) { this.setAttribute("src", source); if (typeof callback === "function") callback.call(this); } }); function unveil() { var inview = images.filter(function() { var $e = $(this); if ($e.is(":hidden")) return; var wt = $w.scrollTop(), wb = wt + $w.height(), et = $e.offset().top, eb = et + $e.height(); return eb >= wt - th && et <= wb + th; }); loaded = inview.trigger("unveil"); images = images.not(loaded); } $w.on("scroll.unveil resize.unveil lookup.unveil", unveil); unveil(); return this; }; })(window.jQuery || window.Zepto); $(document).ready(function(){ //Unveil Lazy Loader var o = $('.lazy img'); $(o).unveil(0, function () { $(this).load(function () { $(this).parent().addClass("lazy-loaded"); }) }); });