qiaowei | f044a74 | 2019-07-10 16:04:20 +0800 | [diff] [blame^] | 1 | /**
|
| 2 | * aui-lazyload.js
|
| 3 | * @author 流浪男
|
| 4 | * Licensed under the MIT license.
|
| 5 | * http://www.opensource.org/licenses/mit-license.php
|
| 6 | */
|
| 7 | (function( window, undefined ) {
|
| 8 | "use strict";
|
| 9 | var _loadImgNodes;
|
| 10 | var auiLazyload = function(params) {
|
| 11 | this.errorImage = params.errorImage||false;
|
| 12 | this._init(params);
|
| 13 | };
|
| 14 | auiLazyload.prototype = {
|
| 15 | _init: function(params) {
|
| 16 | var self = this;
|
| 17 | _loadImgNodes = document.querySelectorAll('[data-src]');
|
| 18 | self._judgeImages();
|
| 19 | window.addEventListener('scroll', function(){
|
| 20 | _loadImgNodes = document.querySelectorAll('[data-src]');
|
| 21 | self._judgeImages();
|
| 22 | }, false);
|
| 23 | },
|
| 24 | _judgeImages:function() {
|
| 25 | var self = this;
|
| 26 | if(_loadImgNodes.length){
|
| 27 | for(var i = 0; i < _loadImgNodes.length; i++){
|
| 28 | if (_loadImgNodes[i].getBoundingClientRect().top < window.innerHeight) {
|
| 29 | self._loadImage(_loadImgNodes[i]);
|
| 30 | }
|
| 31 | }
|
| 32 | }
|
| 33 | },
|
| 34 | _loadImage:function(el){
|
| 35 | var self = this;
|
| 36 | var img = new Image();
|
| 37 | img.src = el.getAttribute('data-src');
|
| 38 | el.src = el.getAttribute('data-src');
|
| 39 | el.removeAttribute("data-src");
|
| 40 | // // 图片加载失败
|
| 41 | img.onerror = function() {
|
| 42 | el.src = self.errorImage || el.getAttribute('src');
|
| 43 | el.removeAttribute("data-src");
|
| 44 | };
|
| 45 | }
|
| 46 | }
|
| 47 | window.auiLazyload = auiLazyload;
|
| 48 | })(window);
|