uzyskać dynamicznie wysokość okna z jquery dla galerii obrazów - jquery

Potrzebuję pomocy z funkcją zmiany rozmiaru okna. Mam prostą galerię zdjęć lightbox, ale mam problem z maksymalną wysokością obrazu.

Teraz maksymalna wysokość obrazu nie zmienia się, jeśli zmieni się rozmiar przeglądarki. Chciałbym dynamicznie dopasować obraz do wysokości obrazu.

Próbowałem użyć funkcji zmiany rozmiaru okna, ale bez powodzenia.

Dzięki za wszelką pomoc.

Oto mój kod:

$ (document) .ready (function () {

$(".lightbox_trigger").click(function(e) {

e.preventDefault();
var image_href = $(this).attr("href");
var image_title = $(this).find("img").attr("alt");
var windowHeight = $(window).height() - 100;

var lightbox =
"<div id="lightbox">" +
"<div id="lightbox-in"><div id="content-lb">" +
"<img src="/images/" + image_href + "" />" +
"</div></div>" +
"</div>";
$("body").append(lightbox);

if ($("#lightbox").length > 0) {

$("#lightbox-in").html("<div id="content-lb"><a class="lb-close"><i class="fa fa-times"></i></a><img src="/images/" + image_href + "" style="max-height:  "+ windowHeight +"px; " /></div><div class="clear"></div><span class="img-item-title">" + image_title + "</span>");

$("#lightbox").fadeIn();
} else {

var lightbox =
"<div id="lightbox">" +
"<div id="lightbox-in"><a class="lb-close"><i class="fa fa-times"></i></a>" +
"<div id="content-lb"><img src="/images/" + image_href + "" style=" max-height:  "+ windowHeight +"px; " />" +
"</div></div>" +
"</div>";
$("body").append(lightbox);
}

});

$(document).on("click", "#lightbox", function() {
$("#lightbox").fadeOut();
$("#lightbox").remove();
});

});

Odpowiedzi:

Możesz użyć resize() na obiekcie okna za pomocą jQuery.

$(window).resize(function() {
// window has been resized
var height = $(window).height() - 100;
$("#content-lb img").css("max-height", height);
});

Wiem, że powiedziałeś, że próbowałeś resize() ale co z tym nie działało?