Make the world a better place, one bug at a time.

Parallax Effect

Parallax Effect
Tuesday, 22 July 2014 by @giancarlo84

The Demo

Press the LEFT or RIGHT keys to move around.

The Code

Drawing The Layers

This function will calculate the offset x and y position of the layer depending on the cx, cy values and a factor f that determines how fast each layer should move. It will also make sure the offset remains positive and an integer.

All layers will repeat themselves if either the repeat_x or repeat_y properties are set to true.

HTML5 Canvas Parallax