Sprite Shearing
WARNING: FireFox cannot correctly run a shearing effect.
This bug in FireFox has been submitted to
Bugzilla (661452)
Specifically, if the shearing operation operates such that the sprite is 0 (zero) size either vertically or horizontally, then you entire animation will cease to function. This occurs when a shear "crosses over" itself. For example when the top of the sprite shears down past the bottom of the sprite. The bug may not occur immediately, but will eventually.
I hope they fix it soon.
Shearing a sprite (which is easier to show, than explain), shears the sprite around the given center along either the x or y axis. You may also shear on both axes simultaneously by specifying a type of "xy". A shear value of 1 is equivalent to shearing the distance of the sprite size along that axis. Therefore shear value of 2 (along the x-axis) will make the sprite 3 times wider than its original size. The shear value is actually set with the "until" property because you shear until that value is reached.
Shearing
editable

Tipping Sprites
You can combine a shearing effect with scaling to simulate a sprite falling forward as in this example.
editable
