Jquery Waypoints 未检测到视口

Question

我正在使用 jquery waypoints 来添加/删除类。现在，我正在将文档加载到包装器 div 中。代码如下：

$(function () {
         $('.content-section').load('about.html');
     });

但是，当它加载 html 文档时，所有的类都会添加到它们对应的元素中，即使它们不在视口中。让它正常工作的唯一方法是，如果我调整屏幕大小并返回，它就会开始正确检测视口上的元素。

有人知道为什么会这样吗？

编辑：我还应该提到我在没有加载外部 html 文档的情况下测试了我的网站。例如，我将“about.html”中的所有元素都放到了主包装器 div 中，这当然是在另一个 html 文档中，并且航点检测到视口就好了。

Answer 1

您的代码设置为在带有$(function(){ 的 dom 上运行。

如果您只希望它在调整窗口大小时运行，则使用该事件包装您的代码，如下所示：

$(function(){

    $( window ).resize(function() {

        $('.content-section').load('about.html');

    });

});

您可以在此处阅读有关 jQuery 调整大小事件的更多信息：https://api.jquery.com/resize/