如何将视口的最大高度设置为浏览器窗口的高度？答案

【问题标题】：How to set the maximum height of the viewport to the height of the browser window?如何将视口的最大高度设置为浏览器窗口的高度？
【发布时间】：2018-03-08 16:45:58
【问题描述】：

我离专家还很远，但我的代码几乎可以按照我的意愿运行 - 我可以制作我的画廊，并且视口会打开并显示我的图像，我的所有选项都可以按照我的意愿工作等等。

对我来说不希望发生的事情是，如果网页足够长可以滚动，当灯箱视口打开时（显示纵向图像时）比浏览器窗口的高度“高”，并且所以你必须滚动才能看到图像。

我知道我可以将 maxHeight 选项设置为任意数量的像素，但我宁愿不这样做，因为这当然会限制使用更大屏幕的人。

理想情况下，我希望视口与浏览器窗口底部的距离与它与顶部的距离相同，根据需要调整图像大小（如果网页不是，它已经这样做了可滚动）。

我认为发生的事情是 Lightbox 正在使用网页的完整、可滚动高度来确定视口的最大高度，而我想要一个使用浏览器窗口高度的选项。

这似乎是它在 Lightbox 本身网站上的工作方式 - http://lokeshdhakar.com/projects/lightbox2/#examples - 4 图像集的工作方式几乎就是我希望我的工作方式（尽管我会有更多图像）。我相信这与加载到该页面但未包含在您下载的示例和 Lightbox 存档中的额外 screen.css 有关，但我不知道足够的 CSS 来解码我需要的内容它。

希望这一切都有意义 - 有什么想法吗？非常感谢您的帮助。

【问题讨论】：

标签： lightbox2

【解决方案1】：

图像的最大高度计入文件 lightbox.js 的第 295 行（适用于 v2.9.0）：

windowHeight = $(window).height(); 要从浏览器窗口的高度计算它，请将此行替换为以下内容：

windowHeight = document.body.clientHeight;

【讨论】：

请考虑使用块语句来提高答案的可读性

【解决方案2】：

确保您的页面具有有效的文档类型（例如 <!DOCTYPE html>）。如果缺少此项，则 Lightbox2 无法正确计算窗口大小。（不确定这是否是 Lightbox2、Jquery 或 Javascript 的整体问题，但我可以保证修复该细节解决了我的问题。

【讨论】：