Skip to content

Instantly share code, notes, and snippets.

@maneja81
Created June 29, 2013 10:39
Show Gist options
  • Save maneja81/5890694 to your computer and use it in GitHub Desktop.
Save maneja81/5890694 to your computer and use it in GitHub Desktop.
A CodePen by Mohit Aneja. Proportionate Window and Element Heights - Tried this for responsive design. Check it out and let me know if any improvements can be done.
Window Height:
Element Height:
height_fix('#test', window);
function height_fix(element, parent){
var woh = $(parent).height();
var eoh = $(element).height();
$(window).resize(function(){
var eh = $(element).height();
var wh = $(parent).height();
var wdiff = wh / woh;
var nh = Math.round((eoh * wdiff));
$(element).height(nh);
$('.log').text('Window Height: '+wh+'px');
$('.log1').text('Element Height: '+nh+'px');
})
}
body{
margin:40px;
}
#test{
width: 100%;
height: 100px;
background: #444;
color: #fff;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment