excanvas - aspect ratio
HTML
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>aspectratio test</title>
<!--[if IE]><script type="text/javascript" src="http://explorercanvas.googlecode.com/svn/trunk/excanvas.js"></script><![endif]-->
<!--[if lt IE 9]><script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script><![endif]-->
</head>
<body style="margin:0px;">
<canvas id="myCanvas" style="position:absolute;left: 0px; top: 0px; z-index: 1;"></canvas>
</body>
</html>
JavaScript
function initCanvas(id){
var canvas = document.getElementById(id);
if (typeof window.G_vmlCanvasManager!="undefined") {
var canvas=window.G_vmlCanvasManager.initElement(canvas);
var ctx = canvas.getContext('2d');
}else{
var ctx = canvas.getContext('2d');
};
return ctx;
};
function getWindowSize(typ) {
var myWidth = 0, myHeight = 0;
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(typ=="width"){
return myWidth;
}else{
return myHeight;
};
};
function canvasFullScreen(id,imgSrc) {
imageCanvas = document.getElementById(id);
var image2d = initCanvas(id);
function canvasFullScreenResize() {
imageCanvas.width = 0;
imageCanvas.height = 0;
var windowWidth = getWindowSize("width");
var windowHeight = getWindowSize("height");
var yScale = windowHeight / img.height;
var xScale = windowWidth / img.width;
var newImgHeight = img.height * xScale;
var newImgWidth = windowWidth;
if (windowHeight >= newImgHeight) {
newImgHeight = windowHeight;
newImgWidth = img.width * yScale;
};
imageCanvas.width = windowWidth;
imageCanvas.height = windowHeight;
var diffX...