<iframe id="ifm" width="100%" height="500" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="http://www.kiwispace.org.nz/mark/kiwimars/map-elevation/profile.php"></iframe>

<style>
   #loading-grid-page {
	color: #ffffff;
	font: 700 11px/25px 'proxima-nova-1', 'proxima-nova-2', sans-serif;
	letter-spacing: 1px;
	text-transform: uppercase;
	background: #111111 url('images/ajax-loader-black.gif') no-repeat 15px center;
	border-radius: 2px;
	border: 1px solid #111111;
	padding: 5px 30px;
	text-align: center;
	width: 200px;
	position: fixed;
	left: 50%;
	top: 50%;
	margin-top: -50px;
	margin-left: -100px;
	z-index: 1000000;
   }
</style>
<div id="loading-grid-page">LOADING MAP<br>This may take 10-20 seconds</div>
<script>
   function hideLoading() {
      document.getElementById('loading-grid-page').style.display = 'none';
   }
   setTimeout( "hideLoading()", 1000*4);
</script>


<script>
function pageY(elem) {
    return elem.offsetParent ? (elem.offsetTop + pageY(elem.offsetParent)) : elem.offsetTop;
}
var buffer = 40; //buffer at bottom
function resizeIframe() {
    var height = window.innerHeight || document.body.clientHeight || document.documentElement.clientHeight;
    height -= pageY(document.getElementById('ifm'))+ buffer ;
    height = (height < 0) ? 0 : height;
    document.getElementById('ifm').style.height = height + 'px';
}
window.onresize = resizeIframe;
window.onload = resizeIframe;
</script>

#eagle a {text-decoration: none; }

<div id="eagle" align="center">

</div>