<html>
<head>
<script type="text/javascript" src="http://ajax.microsoft.com/ajax/jquery/jquery-1.4.2.min.js"></script>
<script type="text/javascript">
var contWidth=120;
var contHeight=83;
var bgOrigWidth=1280;
var bgOrigHeight=632;
$(document).ready(function() {
resize();
$(window).bind('resize', function(){resize();});
});
function resize()
{
var myWidth;
var myHeight;
if( typeof( window.innerWidth ) == 'number' ) {
//Non-IE
myWidth = window.innerWidth;
myHeight = window.innerHeight;
} else if( document.documentElement &&
( document.documentElement.clientWidth || document.documentElement.clientHeight ) ) {
//IE 6+ in 'standards compliant mode'
myWidth = document.documentElement.clientWidth;
myHeight = document.documentElement.clientHeight;
} else if( document.body && ( document.body.clientWidth || document.body.clientHeight ) ) {
//IE 4 compatible
myWidth = document.body.clientWidth;
myHeight = document.body.clientHeight;
}
if(contWidth > myWidth){
myWidth=contWidth;
}
if(contHeight > myHeight){
myHeight=contHeight;
}
//document.getElementById("contentFrame").style.left=((myWidth-contWidth)/2)+"px";
//document.getElementById("contentFrame").style.top=(myHeight-contHeight)/2+"px";
//alert((bgOrigWidth-myWidth)+" > "+(bgOrigHeight-myHeight));
var heightDiff=bgOrigHeight-myHeight;
var widthDiff=bgOrigWidth-myWidth;
var heightDiffPercent=(heightDiff/bgOrigHeight)*100;
var widthDiffPercent=(widthDiff/bgOrigWidth)*100;
if(widthDiffPercent > heightDiffPercent){
newHeight=myHeight;
newWidth=(myHeight/bgOrigHeight)*bgOrigWidth;
}else{
newWidth=myWidth;
newHeight=(myWidth/bgOrigWidth)*bgOrigHeight;
}
//alert("newWidth: "+newWidth+" .. "+"newHeight: "+newHeight+" .. "+(bgOrigWidth-myWidth)+" > "+(bgOrigHeight-myHeight))
//var imgArr=document.getElementsByTagName("img");
//imgArr[0].src="images/background/bg_home_1.jpg";
var imgArr=$("#img_bg");
imgArr.css("width",newWidth+"px");
imgArr.css("height",newHeight+"px");
//imgArr.width=newWidth;
//imgArr.height=newHeight;
// return newWidth+"|"+newHeight;
}
</script>
<style type="text/css">
body
{
padding:0px;
margin:0px;
}
html
{
overflow:hidden;
}
</style>
</head>
<body>
<div style="overflow:hidden;">
<img id="img_bg" src='Header2.png' />
</div>
</body></html>