I'm currently working on an app that'll run using HTML5's canvas element. I have code working to resize the Canvas to fit the size of the window as it resized as follows:

```
<script type="text/javascript">
$(window).resize(function(){
var canvas = document.getElementById('canvas');
canvas.width=window.innerWidth;
canvas.height = window.innerHeight;
});
</script>

```

However, I want my canvas to be fully sized from the get-go, not just when somebody resizes the screen. For some reason, when I copy the code above, except I change `$(window).resize` to `$(window).load` or `$(document).ready`, the canvas does not get set to the size of the window to begin with. 

Does anybody see something wrong with what I'm trying to do that I'm not seeing, or have any other ideas on how to achieve this? 

Best, and thanks in advance,  

Sami

EDIT:

It would probably be good to note that I'm loading a ProcessingJS sketch into the canvas. I don't know whether the time that it takes for that to load ends up having an impact on things or not, but I figured I might as well make a mention of this...