i have this script below that will resize the ".content" on window resize it works fine but the only problem is that it jerks it waits until the resize has finished and then resizes the ".content" is there a wait to smooth the resizing that it resizes while the window resizes?
javascript
function foo(){
//e.cancelBubble = true;
$('.content').each(function (){
p = $('.content').parent();
var ch = 0;
var cw = 0
c = p.children().each(function (i,n){
ch +=$(this).height()
cw +=$(this).width()
});
$(this).height(p.height()-(ch-$(this).height()) )
.width(p.width()-(cw-$(this).width()) )
t = $('#tmp');
t.text('p:height: ' +p.height()+' c:'+ch );
});
}
$(window).resize(foo)
css
html,body{height: 100%; width: 100%; margin: 0; padding: 0; }
.holder{
width: 100%;
height: 100%;
background: yellow;
}
.header{
background-color: red;
}
.footer{
background-color: brown;
}
.content{
background-color: #eeeeee;
}
html
<body onload="foo();" onresize="foo()">
<div class="holder">
<div class="header">
#header
</div>
<div class="content">
#content
<div id="tmp">Waiting...</div>
</div>
<div class="footer">
#footer
</div>
</div>
</body>