User:Irukaza/common.css:修订间差异
跳到导航
跳到搜索
imported>=海豚= 无编辑摘要 |
imported>=海豚= ([InPageEdit] 没有编辑摘要) |
||
(未显示同一用户的1个中间版本) | |||
第1行: | 第1行: | ||
. | window.smallDelay = (function(window, document, undefined) { | ||
'use strict'; | |||
var store = [],poll; | |||
} | var settings = { | ||
. | offset:0, //离可视区域多少像素的图片可以被加载 | ||
throttle: 250 //图片延时多少毫秒加载 | |||
} | |||
} | |||
var _inView = function(el) { | |||
var coords = el.getBoundingClientRect(); | |||
return ((coords.top >= 0 && coords.left >= 0) && coords.top <= ((window.innerHeight || document.documentElement.clientHeight) + parseInt(settings.offset))); | |||
}; | |||
var _pollImages = function() { | |||
for (var i = store.length; i--;) { | |||
var self = store[i]; | |||
if (_inView(self)) { | |||
self.src = self.getAttribute('data-delay'); | |||
store.splice(i, 1); | |||
} | |||
} | |||
}; | |||
var _throttle = function() { | |||
clearTimeout(poll); | |||
poll = setTimeout(_pollImages, settings.throttle); | |||
}; | |||
var init = function(obj) { | |||
var nodes = document.querySelectorAll('[data-delay]'); | |||
var opts = obj || {}; | |||
settings.offset = opts.offset || settings.offset; | |||
settings.throttle = opts.throttle || settings.throttle; | |||
for (var i = 0; i < nodes.length; i++) { | |||
store.push(nodes[i]); | |||
} | |||
_throttle(); | |||
//滚动监听执行图片懒加载 | |||
if (document.addEventListener) { | |||
window.addEventListener('scroll', _throttle, false); | |||
} else { | |||
window.attachEvent('onscroll', _throttle); | |||
} | |||
//返回该对象进行链式操作 | |||
return this; | |||
}; | |||
return { | |||
init: init, | |||
render: _throttle | |||
}; | |||
})(window, document); |
2021年5月16日 (日) 09:33的版本
window.smallDelay = (function(window, document, undefined) {
'use strict';
var store = [],poll;
var settings = {
offset:0, //离可视区域多少像素的图片可以被加载
throttle: 250 //图片延时多少毫秒加载
}
var _inView = function(el) {
var coords = el.getBoundingClientRect();
return ((coords.top >= 0 && coords.left >= 0) && coords.top <= ((window.innerHeight || document.documentElement.clientHeight) + parseInt(settings.offset)));
};
var _pollImages = function() {
for (var i = store.length; i--;) {
var self = store[i];
if (_inView(self)) {
self.src = self.getAttribute('data-delay');
store.splice(i, 1);
}
}
};
var _throttle = function() {
clearTimeout(poll);
poll = setTimeout(_pollImages, settings.throttle);
};
var init = function(obj) {
var nodes = document.querySelectorAll('[data-delay]');
var opts = obj || {};
settings.offset = opts.offset || settings.offset;
settings.throttle = opts.throttle || settings.throttle;
for (var i = 0; i < nodes.length; i++) {
store.push(nodes[i]);
}
_throttle();
//滚动监听执行图片懒加载
if (document.addEventListener) {
window.addEventListener('scroll', _throttle, false);
} else {
window.attachEvent('onscroll', _throttle);
}
//返回该对象进行链式操作
return this;
};
return {
init: init,
render: _throttle
};
})(window, document);