javascript - 延迟加载 : How to create a lazy loading html page using jquery

Question

我想要一个页面，只有当它通过滚动到达该部分时才加载内容，就像 pinterest 网站所做的那样。

实现它的设计是什么，或者是否有插件可以做到这一点？请帮忙。

Answer 1

$(window).on( "scroll" , function() {

     var $document = $(document);
     var $window = $(this);

     if( $document.scrollTop() >= $document.height() - $window.height() - 400 ) {
         // do something
     }

 });

其中 400 是您距页面底部的偏移量。有一些插件可以做到这一点，但这是一些简单的代码。我建议使用 underscorejs 来限制此功能，因为每次滚动顶部更改时都会触发此功能。所以对于每个像素它都会触发。通常我将其限制为每秒仅运行 60 帧。