MediaWiki:Gadget-jQueryLazyload.js
外观
注意:在发布之后,您可能需要清除浏览器缓存才能看到所作出的更改的影响。
- Firefox或Safari:按住Shift的同时单击刷新,或按Ctrl-F5或Ctrl-R(Mac为⌘-R)
- Google Chrome:按Ctrl-Shift-R(Mac为⌘-Shift-R)
- Edge:按住Ctrl的同时单击刷新,或按Ctrl-F5。
/**
* -------------------------------------------------------------------------
* !!! DON'T MODIFY THIS PAGE MANUALLY, YOUR CHANGES WILL BE OVERWRITTEN !!!
* -------------------------------------------------------------------------
*/
var _addText = '{{GHIACode|page=GHIA:MoegirlPediaInterfaceCodes/blob/master/src/gadgets/jQueryLazyload/Gadget-jQueryLazyload.js|user=[[U:AnnAngela]]|co-authors=GH:github-actions[bot]|longId=103d1a563ea4ccc8ff29fb55c9bcd88329a56eb5|shortId=103d1a56|summary=feat: rename (#594)|body=<nowiki>Co-authored-by: github-actions[bot] <41898282+github-actions[bot]📧users.noreply.github.com></nowiki>}}';
/* <pre> */
/**
* @source https://github.com/tuupola/lazyload/compare/2.x...d3ad81c12332a0f950c6c703ff975b60350405a4
* 更新后请同步更新上面链接到最新版本
*/ /*!
* Lazy Load - JavaScript plugin for lazy loading images
*
* Copyright (c) 2007-2019 Mika Tuupola
*
* Licensed under the MIT license:
* http://www.opensource.org/licenses/mit-license.php
*
* Project home:
* https://appelsiini.net/projects/lazyload
*
* Version: 2.0.0-rc.2
*
*/ "use strict";
function _array_like_to_array(arr, len) {
if (len == null || len > arr.length) len = arr.length;
for(var i = 0, arr2 = new Array(len); i < len; i++)arr2[i] = arr[i];
return arr2;
}
function _array_without_holes(arr) {
if (Array.isArray(arr)) return _array_like_to_array(arr);
}
function _class_call_check(instance, Constructor) {
if (!(instance instanceof Constructor)) {
throw new TypeError("Cannot call a class as a function");
}
}
function _defineProperties(target, props) {
for(var i = 0; i < props.length; i++){
var descriptor = props[i];
descriptor.enumerable = descriptor.enumerable || false;
descriptor.configurable = true;
if ("value" in descriptor) descriptor.writable = true;
Object.defineProperty(target, descriptor.key, descriptor);
}
}
function _create_class(Constructor, protoProps, staticProps) {
if (protoProps) _defineProperties(Constructor.prototype, protoProps);
if (staticProps) _defineProperties(Constructor, staticProps);
return Constructor;
}
function _iterable_to_array(iter) {
if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter);
}
function _non_iterable_spread() {
throw new TypeError("Invalid attempt to spread non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
}
function _to_consumable_array(arr) {
return _array_without_holes(arr) || _iterable_to_array(arr) || _unsupported_iterable_to_array(arr) || _non_iterable_spread();
}
function _unsupported_iterable_to_array(o, minLen) {
if (!o) return;
if (typeof o === "string") return _array_like_to_array(o, minLen);
var n = Object.prototype.toString.call(o).slice(8, -1);
if (n === "Object" && o.constructor) n = o.constructor.name;
if (n === "Map" || n === "Set") return Array.from(n);
if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _array_like_to_array(o, minLen);
}
(function() {
var defaults = {
src: "data-src",
srcset: "data-srcset",
selector: ".lazyload",
root: null,
rootMargin: "0px",
threshold: 0
};
/**
* Merge two or more objects. Returns a new object.
* @private
* @param {Boolean} deep If true, do a deep (or recursive) merge [optional]
* @param {Object} objects The objects to merge together
* @returns {Object} Merged values of defaults and options
*/ var extend = function(_deep) {
for(var _len = arguments.length, _args = new Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++){
_args[_key - 1] = arguments[_key];
}
var extended = {};
var deep = typeof _deep === "boolean" ? _deep : false;
var args = _to_consumable_array(typeof _deep !== "boolean" ? [
_deep
] : []).concat(_to_consumable_array(_args));
/* Merge the object into the extended object */ var merge = function(obj) {
for(var prop in obj){
if (Object.prototype.hasOwnProperty.bind(obj)(prop)) {
/* If deep merge and property is an object, merge properties */ if (deep && Object.prototype.toString.bind(obj[prop])() === "[object Object]") {
extended[prop] = extend(true, extended[prop], obj[prop]);
} else {
extended[prop] = obj[prop];
}
}
}
};
var _iteratorNormalCompletion = true, _didIteratorError = false, _iteratorError = undefined;
try {
/* Loop through each object and conduct a merge */ for(var _iterator = args[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true){
var obj = _step.value;
merge(obj);
}
} catch (err) {
_didIteratorError = true;
_iteratorError = err;
} finally{
try {
if (!_iteratorNormalCompletion && _iterator.return != null) {
_iterator.return();
}
} finally{
if (_didIteratorError) {
throw _iteratorError;
}
}
}
return extended;
};
var LazyLoad = /*#__PURE__*/ function() {
function LazyLoad(images, options) {
_class_call_check(this, LazyLoad);
this.settings = extend(defaults, options || {});
this.images = images || document.querySelectorAll(this.settings.selector);
this.observer = null;
this.init();
}
_create_class(LazyLoad, [
{
key: "init",
value: function init() {
/* Without observers load everything and bail out early. */ if (!window.IntersectionObserver) {
this.loadImages();
return;
}
var self = this;
var observerConfig = {
root: this.settings.root,
rootMargin: this.settings.rootMargin,
threshold: [
this.settings.threshold
]
};
this.observer = new IntersectionObserver(function(entries) {
Array.prototype.forEach.bind(entries)(function(entry) {
if (entry.isIntersecting) {
self.observer.unobserve(entry.target);
var src = entry.target.getAttribute(self.settings.src);
var srcset = entry.target.getAttribute(self.settings.srcset);
if ("img" === entry.target.tagName.toLowerCase()) {
if (src) {
entry.target.src = src;
}
if (srcset) {
entry.target.srcset = srcset;
}
} else {
entry.target.style.backgroundImage = "url(".concat(src, ")");
}
}
});
}, observerConfig);
Array.prototype.forEach.bind(this.images)(function(image) {
self.observer.observe(image);
});
}
},
{
key: "loadAndDestroy",
value: function loadAndDestroy() {
if (!this.settings) {
return;
}
this.loadImages();
this.destroy();
}
},
{
key: "loadImages",
value: function loadImages() {
if (!this.settings) {
return;
}
var self = this;
Array.prototype.forEach.bind(this.images)(function(image) {
var src = image.getAttribute(self.settings.src);
var srcset = image.getAttribute(self.settings.srcset);
if ("img" === image.tagName.toLowerCase()) {
if (src) {
image.src = src;
}
if (srcset) {
image.srcset = srcset;
}
} else {
image.style.backgroundImage = "url('".concat(src, "')");
}
});
}
},
{
key: "destroy",
value: function destroy() {
if (!this.settings) {
return;
}
this.observer.disconnect();
this.settings = null;
}
}
]);
return LazyLoad;
}();
window.lazyload = function(images, options) {
return new LazyLoad(images, options);
};
if (window.jQuery) {
jQuery.fn.lazyload = function(_options) {
var _$_options;
var options = _options || {};
(_$_options = options).attribute || (_$_options.attribute = "data-src");
new LazyLoad(this.toArray(), options);
return this;
};
}
})();
/* </pre> */