Skip to content

Instantly share code, notes, and snippets.

@tkellen

tkellen/gist:1179334

Created August 29, 2011 20:32
Show Gist options
  • Save tkellen/1179334 to your computer and use it in GitHub Desktop.
Save tkellen/1179334 to your computer and use it in GitHub Desktop.
Download ZIP
fixed height header 100% iframe
Raw
gistfile1.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8"/>
<title>whatever</title>
<style type="text/css">
html,body { overflow:hidden; height: 100%; margin:0; padding:0; }
#top { position:fixed; height:40px; width:100%; background-color:#000 }
</style>
</head>
<body>
<div id="top"></div>
<iframe id="iframe" src="http://www.goingslowly.com" frameborder="0" style="margin-top:40px;"></iframe>
<script src="http://code.jquery.com/jquery-1.6.2.min.js"></script>
<script>
// save height and width
var _h,_w;
function sizeframe()
{
// get current height
var h = $(window).height();
// get current width
var w = $(window).width();
// if they don't match the last time it was checked, reset
if(h != _h || w != _w)
{
$('#iframe').css('height',h-40);
$('#iframe').css('width',w);
height = _h;
width = _w;
}
};
$(document).ready(function(){$(window).resize(sizeframe);sizeframe();});
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment