燈箱圖像max-height =用戶屏幕高度

Question

我正在爲攝影師構建一個圖片庫。你可以找到該網站here.
我想要做的是設置圖像的高度，以便它永遠不會脫離屏幕。換句話說：

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

但是，這是行不通的。由於我的父母的身高比屏幕大，我的ul。

圖像都在1000px或更高。當然，我們不想讓它們從屏幕上掉下來。有沒有人有任何想法我可以解決這個問題？

在此先感謝！

Answer 1

純CSS，你可以使用媒體查詢，例如：（！注意 - > CSS3）

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

與jQuery它更具活力和更簡單：

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