Instant HTML5 2D Platformer - Instant HTML5 2D Platformer - page 20

if (x === 0)
{
[0] = deltaX * this.deltaScroll;
}

if (y === 0)
{
deltaPosition[1] = deltaY * this.deltaScroll;
}

background = this.UpdateBackground(canvas, position, fillArea,
deltaPosition);
}
}
}
}

ScrollingBackground.prototype = new DrawableObject();

2. Before we can take advantage of this new object, we need to load the textures that

will represent the background into our application.
var sky = new Image();
sky.src = "textures/sky.png";

var cloud = new Image();
cloud.src = "textures/cloud.png";

var mountain = new Image();
mountain.src = "textures/mountain.png";

var forest = new Image();
forest.src = "textures/forest.png";

3. With the ScrollingBackground object implemented and the required textures

loaded, we then need to create a number of new instances of this object. Each of
which will utilize the previously loaded textures that will be used to represent a layer
within the background.
this.sky = new ScrollingBackground().InitScrollingBackground(sky,
0, 0, 1, 800, 600, 0.5);
this.cloud = new ScrollingBackground().
InitScrollingBackground(cloud, 0, 0, 2, 800, 600, 0.5);
this.mountain = new ScrollingBackground().InitScrollingBackground(
mountain, 0, 0, 3, 800, 600, 0.75);
this.forest = new ScrollingBackground().
InitScrollingBackground(forest, 0, 0, 4, 800, 600, 0.9);