Megaptery, explorez les profondeurs du web !

Flip est un plugin jQuery qui permet de retourner des éléments HTML selon les axes X ou Y. L’animation appelée « flip » s’effectue sur un bloc appelé « flip-box ». Différentes options existent pour paramétrer la vitesse de la transition, la couleur ou l’appel de fonctions.

Comment l’utiliser ?

On sélectionne la div « flip-box » sur laquelle on applique la fonction flip().

$("#flipbox").flip({
	direction:'tb',
	content:'this is my new content'
});

Les options

• content : contenu de la « flip-box » (HTML, texte ou objet jQuery)
• direction : sens du « flip » avec comme valeurs ‘tb’, ‘bt’, ‘lr’, ‘rl’ (par défault:’tb’)
• color : couleur du background de la « flix-box »
• speed : vitesse du « flip »
• onBefore : fonction synchrone exécutée avant le « flip »
• onAnimation : fonction synchrone exécutée à la moitié du « flip »
• onEnd : fonction synchrone exécutée après le « flip »

À noter qu’il est nécessaire d’intégrer le plugin jQuery UI car Flip utilise UI Core et Effects Core. Côté compatibilité, Flip fonctionne avec les principaux navigateurs du marché : Firefox, Opera, Chrome, Safari, et Internet Explorer (6+).

Requis : jQuery + jQuery UI
Démonstration : http://lab.smashup.it/flip/
Licence : MIT/GPL