28172 sujets

CSS et mise en forme, CSS3

Bonjour bonjour,

Désolé pour ce titre un peu foireux, j'ai pas trouvé mieux !

Je cherche à exécuter une animation assez précise, et je ne trouve pas mon bonheur sur le net.

En gros, l'idée ressemblerait à cela : http://www.jqueryrain.com/?fSzHKZhz

Sauf qu'au lieu de tourner mes pages de gauche à droite, je voudrais qu'elles partent vers le haut (un peu comme on fait avec un bloc notes).
J'ai beau regarder la doc de ce joli plugin, rien qui ressemble à ce que je souhaite faire.

Je n'ai pas de code à vous montrer ou quoi que ce soit, j'aimerai juste savoir si certains d'entre vous ont une idée de comment faire, une librairie à me proposer ou je ne sais quoi d'autre...

Merci d'avance.
Bonjour,

S'il s'agit simplement de remplacer une image par une autre, en faisant glisser l'image vers le haut, pour découvrir la nouvelle image qui est dessous, et si l'effet "rolling" n'est pas nécessaire :

C'est certainement possible en Flash, mais je ne connais le sujet...

C'est aussi possible avec les animations css3, mais ces animations ne fonctionnent que sur les nouveaux navigateurs, par exemple pour Internet Explorer à partir de la version 10.
La page suivante est assez explicative :
http://letrainde13h37.fr/17/transitions-et-animations-css/

Et ç'est aussi possible avec une vingtaine d'instructions javascript :
On aura besoin de deux conteneurs (éléments html div), superposés : un conteneur pour l'image en cours, et un conteneur pour l'image suivante. Pour les superposer, utiliser le positionnement css.
Faire une fonction dans laquelle :
- on utilise l'instruction setTimeout() pour régler la vitesse du défilement. (la fonction s'appellera elle-même)
- on affiche l'image suivante en modifiant sa propriété src. (utiliser un tableau javascript contenant toutes les url des images)
- on modifie la propriété style.top de l'image en cours pour la faire glisser vers le haut.
Cette solution aurait l'avantage de fonctionner sur tout type de navigateur.