javascript - 灯箱图片最大高度 = 用户屏幕高度

标签 javascript jquery html css

我正在为一位摄影师构建一个图片库。您可以找到网站 here.
我想要做的是设置图像的高度,使其永远不会从屏幕上掉下来。换句话说:

lightbox img { max-height:100%; max-width:auto; } 

然而,这不起作用。因为我的 ul parent 的高度比屏幕大。

图片都在 1000 像素左右或更高。当然,我们不想让他们从屏幕上掉下来。有谁知道我如何解决这个问题?

提前致谢!

最佳答案

使用纯 CSS,您可以使用媒体查询,例如:(注意 -> CSS3!)

@media screen and (max-height:700px) {
    #lightbox img { max-height: 690px; }
}

使用 jquery 更动态,更简单:

$('#lightbox img').css('max-height', $(document).height()));

关于javascript - 灯箱图片最大高度 = 用户屏幕高度,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16238631/

相关文章:

javascript - jQuery 用户界面 : Save height and position of divs in cookie

javascript - Google Analytics 异步事件跟踪

javascript - Canvas.toDataURL 不适用于移动 Safari iOS?

javascript - 暂停 Jquery.each 循环以确保代码完全执行?

c# - 如何通过服务器代码 C# 将 javascript 代码添加到 LinkBut​​ton?

jquery - 改善辅助功能 : Customising Accordion jQuery and HTML?

html - 弹出窗口中列内的对齐问题

javascript - 如果值存在则应用过滤器,否则忽略 - Mongoose

javascript - 从链中解决 promise

javascript - 必填字段验证器错误地失败了对禁用文本框的验证