100% min-height div with jQuery

The following jQuery script would apply the minimum height of 100% to any div and will refresh this value when the window is re-sized.

This script will have no effect if the content of the div is larger than 100% widow height.

// 100 percent height
$(document).ready(function() {
   var h = $(window).height();
      $("#event-details .day").css("min-height", h);
      $(window).resize(function() {
         var xh = $(window).height();
         $("#event-details .day").css("min-height", xh);
   });
});

Disclaimer:

I had a hard time finding any relevant jQuery solutions online, and after a few hours of googling I attempted writing my own script. Thus, if the script is erroneous in any way please let me know and I’ll be happy to update it.

So far, it works well for me here: www.ottawaarchitectureweek.com (see events page)

oaw-live:

We are a growing city. As we fill in and build upwards, intensification brings up intense feelings and diverse perspectives. It reminds us that the city is a collective project.

Beyond addressing the housing needs of a growing population, we face the design challenges of how to move through the…

Ottawa architecture week 2014.

This is a great article that will never be read because it isn’t supporting a myth that being a dumbass is OK.

NAG #vscocam

John Ruskin @ NAG. This thing is 2”x2” in size. #vscocam