Recently, I studied the implementation of JD.com using jQuery as follows:
is the default address assigned to the src2 attribute of the img tag, and the src attribute value is assigned to it when displayed.
function lazyload(option) {
var settings = {
defObj: null,
defHeight: 0
};
settings = $.extend(settings, option || {});
var defHeight = settings.defHeight;
var defObj = (typeof settings.defObj == "object") ? settings.defObj.find("img") : $(settings.defObj).find("img");
var pageTop = function() {
return document.documentElement.clientHeight Math.max(document.documentElement.scrollTop, document.body.scrollTop) - settings.defHeight;
};
var imgLoad = function() {
defObj. each(function() {
if ($(this).offset().top <= pageTop()) {
var src2 = $(this).attr("src2");
//What has been displayed does not need to be displayed again
if (src2) {
;
}
}
});
};
imgLoad(); );
});
}
lazyload({
defObj:".w1"
});
Statement:The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn