JS/JQuery Effets de transition d'image - stores?

Question

Je voudrais un effet de transition entre 2 images ou plus. Je sais que des transitions simples peuvent être facilement réalisées dans JQuery, en particulier avec le plugin Cycle, mais je veux quelque chose de plus complexe. Like this, bien que ce soit un mauvais exemple. Un effet de style 'stores' où vous pouvez voir une image à travers l'autre quand elle change. J'espère que je suis clair. Je voudrais vraiment éviter d'utiliser Flash si possible. J'ai déjà utilisé animate plusieurs fois déjà. Ce que je veux, c'est un moyen de mettre en œuvre le style de transition auquel je suis lié, soit prêt à l'emploi, soit avec un peu d'aide. Mon problème est que l'image est essentiellement divisée, pas seulement déplacée. Peut-être qu'il y a un moyen d'utiliser des masques?

Answer 1

Si vous êtes bien avec l'option verticale de stores, il y a un plugin jQuery très lisse maintenant que fera l'effet que vous recherchez: http://nivo.dev7studios.com

Answer 2

Les jalonnements diagonaux deviendront presque impossibles avec JavaScript uniquement. Je peux penser à quelques façons de le faire avec des fichiers image, mais ce serait un hack sacré et l'animation est peu susceptible d'être lisse. Il y a probablement des façons de le faire avec canvas, mais ce serait aussi un casse-tête parce que vous devez utiliser un canvas-> vml pour le faire fonctionner avec IE.

Si vous êtes d'accord avec les stores horizontaux/verticaux, ajoutez simplement un groupe de divs et animez la largeur/hauteur.