11548 sujets

JavaScript, DOM et API Web HTML5

Bonjour,

J'ai une envie pour l'un de mes projets : faire slider tout le contenu du site, quand on clique sur un bouton "Next" par exemple. Histoire de mieux comprendre le fonctionnement, j'ai fait 3 screens, qui symbolisent les 3 étapes maitresse de l'évenement :

T = 0. Un a un div principal, en gris, et 2 sous-div : div_01 pour le contenu, à gauche, et div_02 pour un menu, à droite.

http://wir3d.net/bordel/slider_01.jpg

T = 1. On clique sur un bouton "Next", n'importe où sur le site, et les div_01 et div_02 commencent à slidé, pour arriver à T = 2.

http://wir3d.net/bordel/slider_02.jpg

T = 2. div_01 et div_02 ont slidé, et on a maintenant à l'écran div_02 à gauche, et un nouveau div, div_03, à droite.

http://wir3d.net/bordel/slider_03.jpg

Tout ceci doit se faire de manière animée évidemment. jQuery est-il capable de faire ça, ou quelque chose de semblable ? Si vous pensez savoir comment s'y prendre, merci de me donner des pistes : )
Modifié par van___fanel (20 Nov 2009 - 19:24)
Bonjour,

Oui, jQuery peut le faire et très simplement.
Une façon de faire serait de
- Créé la page avec les 3 colonnes l'une à coté de l'autre.
- Avec jquery donné la taille en largeur voulu au conteneur parent (taille de la colonne 1 + 2) et utilisé overflow:hidden pour ne pas voir la 3ème colonne
- Voir la fonction animate pour slider (en bougeant la valeur de padding-left du conteneur parent ?)