JQ 2.1 Canvas Fill

Canvas Filling design with JQuery 2.1

HTML

<div id="pallette">
    <div class="container">
        <canvas id="background"></canvas>
        <canvas id="middleground"></canvas>
        <canvas id="foreground"></canvas>
    </div>
    <div id="stats"></div>
    <div id="chat"></div>
</div>

CSS

body, html {
    margin: 0;
    width: 100%;
    height: 100%;
    padding: 0;
}
div .container {
    width: 100%;
    height: 100%;
}
div#pallette {
    position: absolute;
    top: 1px;
    bottom: 1px;
    left: 1px;
    right: 1px;
}
canvas#background {
    position: fixed;
    left: 0;
    top: 0;
    background: black;
}

JavaScript

window.onresize = function () {
	SizeBackground();
}

$(document).ready(function () {
    SizeBackground();
});

function SizeBackground() {
    var canvas = $("canvas#background")[0];

    fitToContainer(canvas);
}

function fitToContainer(canvas) {
    canvas.width = canvas.parentElement.clientWidth;
    canvas.height = canvas.parentElement.clientHeight;
}