-
Notifications
You must be signed in to change notification settings - Fork 10
/
jquery.laziestloader.min.js
7 lines (7 loc) · 3.37 KB
/
jquery.laziestloader.min.js
1
2
3
4
5
6
7
/**
* @preserve LaziestLoader - v0.7.3 - 2016-01-03
* A responsive lazy loader for jQuery.
* http://sjwilliams.github.io/laziestloader/
* Copyright (c) 2016 Josh Williams; Licensed MIT
*/
!function(factory){"function"==typeof define&&define.amd?define(["jquery"],factory):factory(jQuery)}(function($){var laziestLoader=function(options,callback){function getSource($el){var source,slug,data=$el.data();return data.pattern&&data.widths&&$.isArray(data.widths)?(source=retina?data.patternRetina:data.pattern,source=source||data.pattern,"object"==typeof data.widths[0]?(slug=function(){for(var widths=$.map(data.widths,function(val){return val.size}),bestFitWidth=bestFit($el.width(),widths),i=data.widths.length-1;i>=0;i--)if(data.widths[i].size===bestFitWidth)return data.widths[i].slug}(),source=source.replace(options.sizePattern,slug)):source=source.replace(options.sizePattern,bestFit($el.width(),data.widths))):(source=retina?data.srcRetina:data.src,source=source||data.src),source}function onLoad($el){$el.addClass("ll-loaded").removeClass("ll-notloaded"),$el.trigger("loaded"),"function"==typeof callback&&callback.call($el)}function bindLoader(){$elements.one("laziestloader",function(){var source,$el=$(this);$el.data().ratio&&setHeight.call(this),options.setSourceMode&&(source=options.getSource($el),source&&this.getAttribute("src")!==source&&this.setAttribute("src",source)),$el.addClass("ll-loadstarted"),!options.setSourceMode||"IMG"!==this.nodeName&&"VIDEO"!==this.nodeName&&"AUDIO"!==this.nodeName?onLoad($el):"IMG"===this.nodeName?this.onload=function(){onLoad($el)}:this.onloadstart=function(){onLoad($el)}})}function unbindLoader(){$elements.off("laziestloader")}function laziestloader(){var docEl=document.documentElement,wHeight=window.innerHeight||docEl.clientHeight,wWidth=window.innerWidth||docEl.clientWidth,threshold=options.threshold,$inview=$elements.not($loaded).filter(function(){if(!$(this).is(":hidden")){var rect=$(this)[0].getBoundingClientRect();return rect.bottom+threshold>0&&rect.right+threshold>0&&rect.left<wWidth+threshold&&rect.top<wHeight+threshold}});$inview.trigger("laziestloader"),$loaded.add($inview)}function setHeight(){var $el=$(this),data=$el.data();data.ratio=data.ratio||data.heightMultiplier,data.ratio&&$el.css({height:Math.round($el.width()*data.ratio)})}var $w=$(window),$elements=this,$loaded=$(),retina=window.devicePixelRatio>1,didScroll=!1;options=$.extend(!0,{threshold:0,sizePattern:/{{SIZE}}/gi,getSource:getSource,event:"scroll",scrollThrottle:250,sizeOffsetPercent:0,setSourceMode:!0},options);var useNativeScroll="string"==typeof options.event&&0===options.event.indexOf("scroll"),bestFit=laziestLoader.bestFit=function(targetWidth,widths){var selectedWidth=widths[widths.length-1],i=widths.length,offset=targetWidth*(options.sizeOffsetPercent/100);for(widths.sort(function(a,b){return a-b});i--;)targetWidth-offset<=widths[i]&&(selectedWidth=widths[i]);return selectedWidth};return $elements.addClass("ll-init ll-notloaded").each(setHeight),bindLoader(),useNativeScroll?($w.scroll(function(){didScroll=!0}),setInterval(function(){didScroll&&(didScroll=!1,laziestloader())},options.scrollThrottle)):"function"==typeof options.event?options.event(laziestloader):$w.on(options.event,function(){laziestloader()}),$w.resize(function(){$loaded=$(),unbindLoader(),bindLoader(),laziestloader()}),$(document).ready(function(){laziestloader()}),this};$.fn.laziestloader=laziestLoader});