Centering dynamically a div on window resize using jQuery
The code below will centers a div horizontally and vertically on window resize:
CSS
.centeredDiv{
width: 400px;
height: 400px;
}
Coffee script
# This function gets the current window width and height and set the position of the ".centeredDiv"
adjustPosition = ->
$(".centeredDiv").css
position: "absolute"
left: ($(window).width() - $(".className").outerWidth()) / 2
top: ($(window).height() - $(".className").outerHeight()) / 2
return
# Everytime the user resize the browser window this calls the function "adjustPosition"
$(window).resize adjustPosition
# This calls the function at the start
$(document).ready ->
adjustPosition()