延迟加载不能出现美元符号,否则会被并入延后加载的js中,拖慢图片显示速度
parent
0f6c975fb9
commit
b6604a7bce
@ -1 +1 @@
|
||||
window.isSupportWebp=false;(function(){var img=new Image();function getResult(event){window.isSupportWebp=event&&event.type==='load'?img.width==1:false;createImageLoader()}img.onerror=getResult;img.onload=getResult;img.src='data:image/webp;base64,UklGRiQAAABXRUJQVlA4IBgAAAAwAQCdASoBAAEAAwA0JaQAA3AA/vuUAAA='})();if(!Array.from){Array.from=(function(){var toStr=Object.prototype.toString;var isCallable=function(fn){return typeof fn==="function"||toStr.call(fn)==="[object Function]"};var toInteger=function(value){var number=Number(value);if(isNaN(number)){return 0}if(number===0||!isFinite(number)){return number}return(number>0?1:-1)*Math.floor(Math.abs(number))};var maxSafeInteger=Math.pow(2,53)-1;var toLength=function(value){var len=toInteger(value);return Math.min(Math.max(len,0),maxSafeInteger)};return function from(arrayLike){var C=this;var items=Object(arrayLike);if(arrayLike==null){throw new TypeError("Array.from requires an array-like object - not null or undefined")}var mapFn=arguments.length>1?arguments[1]:void undefined;var T;if(typeof mapFn!=="undefined"){if(!isCallable(mapFn)){throw new TypeError("Array.from: when provided, the second argument must be a function")}if(arguments.length>2){T=arguments[2]}}var len=toLength(items.length);var A=isCallable(C)?Object(new C(len)):new Array(len);var k=0;var kValue;while(k<len){kValue=items[k];if(mapFn){A[k]=typeof T==="undefined"?mapFn(kValue,k):mapFn.call(T,kValue,k)}else{A[k]=kValue}k+=1}A.length=len;return A}}())}if(!Array.prototype.forEach){Array.prototype.forEach=function(callback){var T,k;if(this==null){throw new TypeError("this is null or not defined")}var O=Object(this);var len=O.length>>>0;if(typeof callback!=="function"){throw new TypeError(callback+" is not a function")}if(arguments.length>1){T=arguments[1]}k=0;while(k<len){var kValue;if(k in O){kValue=O[k];callback.call(T,kValue,k,O)}k++}}}function createImageLoader(settings){var loadImageByUrl=function(target){target.addEventListener("load",function(){target.style.opacity=1});if(window.isSupportWebp){target.setAttribute("src",target.getAttribute("originalsrc").replace(/\.jpg$/,'.webp'))}else{target.setAttribute("src",target.getAttribute("originalsrc"))}};var imageList=Array.from(document.querySelectorAll("img[loader=ready]"));imageList.forEach(function(element,index){element.style.opacity=0;element.style.transition="opacity 0.5s ease-in-out";loadImageByUrl(element)});var lazyloader=createLazyloader();lazyloader();function throttle(fn,delay,atleast){var timeout=null,startTime=new Date();return function(){var curTime=new Date();clearTimeout(timeout);if(curTime-startTime>=atleast){fn();startTime=curTime}else{timeout=setTimeout(fn,delay)}}}function getOffset(el){var box=el.getBoundingClientRect();return{top:box.top+window.pageYOffset-document.documentElement.clientTop,left:box.left+window.pageXOffset-document.documentElement.clientLeft}}function createLazyloader(){var lazyImageList=Array.from(document.querySelectorAll("img[loader=lazy]"));lazyImageList.forEach(function(element,index){element.style.opacity=0;element.style.transition="opacity 0.5s ease-in-out"});return function(){var seeHeight=window.innerHeight;var scrollTop=(document.documentElement&&document.documentElement.scrollTop)||(document.body&&document.body.scrollTop);lazyImageList=lazyImageList.filter(function(element,index){var offsetTop=getOffset(element).top;var hasVisible=offsetTop<seeHeight+scrollTop;if(hasVisible){loadImageByUrl(element)}return!hasVisible})}}if(window.addEventListener){window.addEventListener("scroll",throttle(lazyloader,500,500),false)}else{if(window.attachEvent){window.attachEvent("onscroll",throttle(lazyloader,500,500))}}};
|
||||
window.isSupportWebp=false;(function(){var img=new Image();function getResult(event){window.isSupportWebp=event&&event.type==='load'?img.width==1:false;createImageLoader()}img.onerror=getResult;img.onload=getResult;img.src='data:image/webp;base64,UklGRiQAAABXRUJQVlA4IBgAAAAwAQCdASoBAAEAAwA0JaQAA3AA/vuUAAA='})();if(!Array.from){Array.from=(function(){var toStr=Object.prototype.toString;var isCallable=function(fn){return typeof fn==="function"||toStr.call(fn)==="[object Function]"};var toInteger=function(value){var number=Number(value);if(isNaN(number)){return 0}if(number===0||!isFinite(number)){return number}return(number>0?1:-1)*Math.floor(Math.abs(number))};var maxSafeInteger=Math.pow(2,53)-1;var toLength=function(value){var len=toInteger(value);return Math.min(Math.max(len,0),maxSafeInteger)};return function from(arrayLike){var C=this;var items=Object(arrayLike);if(arrayLike==null){throw new TypeError("Array.from requires an array-like object - not null or undefined")}var mapFn=arguments.length>1?arguments[1]:void undefined;var T;if(typeof mapFn!=="undefined"){if(!isCallable(mapFn)){throw new TypeError("Array.from: when provided, the second argument must be a function")}if(arguments.length>2){T=arguments[2]}}var len=toLength(items.length);var A=isCallable(C)?Object(new C(len)):new Array(len);var k=0;var kValue;while(k<len){kValue=items[k];if(mapFn){A[k]=typeof T==="undefined"?mapFn(kValue,k):mapFn.call(T,kValue,k)}else{A[k]=kValue}k+=1}A.length=len;return A}}())}if(!Array.prototype.forEach){Array.prototype.forEach=function(callback){var T,k;if(this==null){throw new TypeError("this is null or not defined")}var O=Object(this);var len=O.length>>>0;if(typeof callback!=="function"){throw new TypeError(callback+" is not a function")}if(arguments.length>1){T=arguments[1]}k=0;while(k<len){var kValue;if(k in O){kValue=O[k];callback.call(T,kValue,k,O)}k++}}}function createImageLoader(settings){var loadImageByUrl=function(target){target.addEventListener("load",function(){target.style.opacity=1});if(window.isSupportWebp){target.setAttribute("src",target.getAttribute("originalsrc").replace('.jpg','.webp'))}else{target.setAttribute("src",target.getAttribute("originalsrc"))}};var imageList=Array.from(document.querySelectorAll("img[loader=ready]"));imageList.forEach(function(element,index){element.style.opacity=0;element.style.transition="opacity 0.5s ease-in-out";loadImageByUrl(element)});var lazyloader=createLazyloader();lazyloader();function throttle(fn,delay,atleast){var timeout=null,startTime=new Date();return function(){var curTime=new Date();clearTimeout(timeout);if(curTime-startTime>=atleast){fn();startTime=curTime}else{timeout=setTimeout(fn,delay)}}}function getOffset(el){var box=el.getBoundingClientRect();return{top:box.top+window.pageYOffset-document.documentElement.clientTop,left:box.left+window.pageXOffset-document.documentElement.clientLeft}}function createLazyloader(){var lazyImageList=Array.from(document.querySelectorAll("img[loader=lazy]"));lazyImageList.forEach(function(element,index){element.style.opacity=0;element.style.transition="opacity 0.5s ease-in-out"});return function(){var seeHeight=window.innerHeight;var scrollTop=(document.documentElement&&document.documentElement.scrollTop)||(document.body&&document.body.scrollTop);lazyImageList=lazyImageList.filter(function(element,index){var offsetTop=getOffset(element).top;var hasVisible=offsetTop<seeHeight+scrollTop;if(hasVisible){loadImageByUrl(element)}return!hasVisible})}}if(window.addEventListener){window.addEventListener("scroll",throttle(lazyloader,500,500),false)}else{if(window.attachEvent){window.attachEvent("onscroll",throttle(lazyloader,500,500))}}};
|
Loading…
Reference in New Issue