Home

HTML 5 w/ Canvas Page Template

<!DOCTYPE HTML>
<html>
<head>
    <title>HTML5 page</title>
    <meta charset="UTF-8">
    <!--link rel="stylesheet" type="text/css" href="site.css"/-->
    <style type="text/css">
        #baseDiv {position:relative; width:80%; left:10%; border:1px solid;}
    </style>
</head>
<body>
    <div id="stageDiv">
        <canvas id="stage" width="800" height="600">Sorry, your browser does not support the canvas tag.</canvas>
    </div>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
    <script type="text/javascript">
    //<![CDATA[
        $(function() {
            var canvas = $('#stage');
            $(window).bind('resize', _resizeCanvas);
            _resizeCanvas();
        });
        function _resizeCanvas() {
            var stageDiv = $('#stageDiv');
            $('#stage').css({
                'width': stageDiv.width(),
                'height': stageDiv.height()
            });
        }
    //]]>
    </script>
</body>
</html>