Apologies in advance if this has already been addressed, but I have tried solutions from other sources without success.
My Objective:
I aim to set the minimum height and width of a div based on the current dimensions of the document. This should trigger whenever the document window is resized.
What I've Attempted:
$(document).ready(function() {
function reset_dimensions() {
doc_height = $(document).height();
doc_width = $(document).width();
$(".flicker-div").css("min-width", doc_width + "px");
$(".flicker-div").css("min-height", doc_height + "px");
alert("From - Function" + doc_width + "x" + doc_height);
}
reset_dimensions();
$(window).resize(function() {
reset_dimensions();
});
});
The Issue at Hand:
Upon initial load, correct dimensions are displayed. However, manual window resizing reveals two noticed problems:
1. The function is called twice, leading to multiple alert boxes. 2. The captured document height remains unchanged. 3. The captured document width increases rapidly, with values not being discarded as they appear static in subsequent runs.
Test Run Output:
On Load:
1349x626
On Resize:
1369x3130
1389x15650
I am convinced that I have overlooked something simple here. Any assistance in resolving this issue would be greatly appreciated.