JavaScript 滚动到指定位置后加载更多图片

一、代码

ottom - window.innerHeight < 0) {
        var picture = self.makePic();
        self.columns[i].appendChild(picture.imgBox);
      }
    }
  });
};

二、知识点

1. scroll

scroll事件一般与window绑定。

2. getBoundingClientRect函数

Element.getBoundingClientRect()方法返回元素的大小及其相对于视口的位置。

rectObject = object.getBoundingClientRect();

返回值为一个对象，包括四个Key（若兼容至IE9，可增加width与height两个Key），单位为像素：
top为元素上端与视口上端的距离，
bottom为元素下端到视口上端的距离，
left为元素左端到视口左端的距离，
right为元素右端到视口左端的距离。

3. window.innerHeight

浏览器窗口的视口（viewport）高度（以像素为单位），如果存在水平滚动条，则包括它。兼容至IE9。