为什么我的javascript只有在其作用的页面部分在浏览器中可见时才起作用？

所以我使用了光滑的图像滑块，一切都很好，直到我考虑了如果放入不同高度的图像会发生什么。然后我写了一小段js来检查哪个图像是最高的，并将所有图像的高度设置为该高度

window.onload = imageSlideChange;

$(window).resize(imageSlideChange);

function imageSlideChange(){
        var tallestImage = $('.slick-slide').first().height();

    $('.slick-slide').each(function(){ //.slick-slide is the class of each image
        if($(this).height() > tallestImage){
            tallestImage = $(this).height();
        }
    });

    $('.slick-slide').each(function(){
        $(this).height(tallestImage);
    }); 
}

但奇怪的是，只有当滑块在浏览器窗口中时，代码才能正确运行。如果我滚动到页面的底部或顶部并重新加载，它将只加载高度为1px的图像。我想可能是图像没有被加载，并将函数设置为仅在

窗口上运行。加载

，但除此之外，我不知道是什么导致了这种行为

当您检查图像时，它们的高度是正确的。1px必须来自其默认高度，这意味着当代码运行时，它必须将其高度读取为0。为什么

---

如果有帮助的话，这一切都是在drupal提供图像时发生的，那么这可能是问题所在吗？

在浏览器开发工具中的实时html离开屏幕时检查它以获取更多线索。有太多的未知项而看不到，您可以设置adaptiveHeight:true；