导致javascript停止运行的最大高度

max-height causing javascript to stop functioning

本文关键字：高度 运行 javascript 导致      更新时间：2023-12-02

感谢您迄今为止的所有尝试。但我觉得我没有那么清楚，所以我决定重写这个问题。因为我一直在寻找答案，或解决问题的方法。

概述：我的客户想要一幅拼贴画。单击后，图像将在prettyPhoto（灯箱克隆）中打开。

我正在使用masonry.js来网格化图像。我使用imagesladed.js来"延迟加载"缩略图。然后我还使用classie.js、AnimOnScroll.js和modernizr.js。

所以，当构建缩略图的ul时，一切都很好。但是当我把它插入到现有的站点时，它就停止工作了。

客户网站的布局类似于框架网站。整个页面有一定的高度，中间有一个部分（#mainbody），需要时可以滚动，比如：

---------------------------------------------|收割台|---------------------------------------------||||||主体||||（滚动）||||||||||---------------------------------------------|页脚|---------------------------------------------

问题是#主体滚动，而整个页面滚动，这只会导致显示一些缩略图。其余的都在那里，但你看不到它们。

我在这里建立了一个虚拟站点来演示，而不是在这里发布大量代码。希望这会让事情变得更容易。

除了两个样式表（masory.js的component.css和default.css），我还添加了test.css，它只包含#mainbody的代码。如果去掉对test.css的引用，一切都会正常工作。

希望我已经把一切都说清楚了。

抱歉-我试图将其添加为注释，但还没有足够的rep。因此，脚本被这个最大高度弄糊涂了，在加载图像时没有考虑到它。您可能需要调整脚本以在滚动时刷新所述最大高度。或者（这是一个长镜头），如果160+张图片只是在一个长列表中，你有没有尝试过在最初未处理的UL标签中添加一些css？就像把它们全部飘到左边。我这么说是假设脚本将重写UL样式，以便以预期的方式显示图像。

也许将UL嵌套在另一个div中会有所帮助，因此最大高度在父div上，例如：

<div id="mainbody">
  <div id="galleryWrapper">
    <ul></ul>
  </div>
</div>

我对你的CSS 有点困惑

#mainbody {    
  height: auto !important;
  height: 650px;
}

因此，将始终使用高度自动。

相关文章：