this.image.width / number yields 0
<p>I'm trying to calculate the width of a sprite using the image width, but the number always comes out as 0, why is that?</p>

<pre><code>function SpriteSheet(image, numFramesX, numFramesY, totalFrames) {
    this.image = image;
    this.numFramesX = numFramesX;
    this.numFramesY = numFramesY;
    this.totalFrames = totalFrames;

    this.spriteWidth = this.image.width / this.numFramesX;
    this.spriteHeight = this.image.height / this.numFramesY;
}

image.onload = function() {
console.log('Image has been loaded');
}
image.src = 'dance.png';
spritesheet = new SpriteSheet(image, 8, 10, 80);
</code></pre>

<p>spritesheet.spriteWidth and spritesheet.spriteHeight always yields 0.  I cornered the problem to 'this.image.width' since it works if I put in the width of the image manually.</p>

<pre><code>this.spriteWidth = 880 / this.numFramesX;
</code></pre>

<p>instead of</p>

<pre><code>this.spriteWidth = this.image.width / this.numFramesX;
</code></pre>

<p>It also works if I calculate it using the object in the console:</p>

<pre><code>spritesheet.image.width / spritesheet.numFramesX
</code></pre>

<p>yields 110</p>

<p><a href="http://jsfiddle.net/sunwooz/kxrEH/1" rel="nofollow">jsfiddle</a></p>
