var
lazyImg =
document.
querySelectorAll(
'img');
//获取所有懒加载的img标签
var
lazyLen =
lazyImg.
length;
//获取所有懒加载的img的长度
var
lazyNum =
0;
//存储图片加载到的位置,避免每次都从第一张图片开始遍历
window.
onscroll =
function () {
var
scrollT =
document.
documentElement.
scrollTop ||
document.
body.
scrollTop;
//滚动条的垂直偏移
var
scrollH =
document.
documentElement.
scrollHeight ||
document.
body.
scrollHeight;
//元素的整体高度
var
clientH =
document.
documentElement.
clientHeight ||
document.
body.
clientHeight;
//元素的可见高度
if (
scrollT ==
scrollH -
clientH) {
console.
log(
"到底部了");
}
else
if (
scrollT <
scrollH -
clientH) {
console.
log(
"到顶了")
}
for (
var
i =
lazyNum;
i <
lazyLen;
i++) {
if (
lazyImg[
i].
offsetTop <
clientH +
scrollT) {
//触发加载
if (
lazyImg[
i].
getAttribute(
'src') ==
'') {
lazyImg[
i].
src =
lazyImg[
i].
getAttribute(
'lazy_src');
}
lazyNum =
i +
1;
}
}
}