BGEffects for scripty2

Description

BGEffects for scripty2 is a JavaScript component for creating perspective animations using background images. It requires Prototype and scripty2 libraries.

Download

• scripty2.bgeffects.js

Dependencies

• Scripty2 & Prototype 1.7 RC2 (see compatibility note below)

Compatibility

Note: current version of scripty2 (2.0.0 beta 1) is only compatible with Prototype 1.7 RC2!

• Firefox 3.6+
• Chrome 9+
• Internet Explorer 8+
• Safari 5+
• Opera 10+

Inspired from

• Nicolas Gallagher: http://nicolasgallagher.com/multiple-backgrounds-and-borders-with-css2/
• Silverback: http://silverbackapp.com/

BGEffects.PerspectiveEffect

The BGEffects.PerspectiveEffect animates background images of nested containers using differents speeds, which creates an illusion of perspective (aka parallax effect).

new BGEffects.PerspectiveEffect($('perspectiveContainer'), {
	cssSelector	: '.perspectiveEffect',	// Valid CSS selector for retrieving layers
	increment	: 1, 					// Differential increment between layers
	loop		: true					// Loop animation forever!
});

BGEffects.POVEffect

The BGEffects.POVEffect is an extension of BGEffects.PerspectiveEffect, which enables point of view through mouse position tracking. Move the mouse within the container to change animation direction and speed.

new BGEffects.PerspectiveEffect($('povContainer'), {
	cssSelector	: '.povEffect',	// Valid CSS selector for retrieving layers
	increment	: 1, 			// Differential increment between layers
	loop		: true			// Loop animation forever!
});