Page 1 sur 1

Besoin d'aide en Javascript

Posté : 17 août 2014, 16:04
par bulletfigurine
Bonjour,

J'ai un site en html et j'aimerai faire défiler des images sur un simple click et je pense que le javascript est vraiment adapté mais le probleme c'est que je n'y connais rien. Pourriez vous m'aider pour programmer une base et j'arriverai a me débrouiller a partir de là.

L'idée c'est que j'ai plusieurs petites vignettes qui affiche une image en plus grand lorsque je click dessus. Mon probleme c'est que j'ai plus de 20 vignettes et j'aimerai en afficher que 9 sur ma pages. Donc l'idée serait de faire défiler les vignettes en cliquant sur les fleches ">" "<".

Pourriez vous m'aider en me programmant une base en javascript qui serait affiché comme ceci sur l'écran:

< 1 2 3 4 5 6 7 8 9 >

Lorsque je clique sur > les variables serait déplacé vers la droite et le dernier chiffre passerait au début. ce qui donnerait ceci :

< 9 1 2 3 4 5 6 7 8 >

Idem pour < mais dans l'autre sens

Est ce possible et si oui, peut on afficher cette ligne sans que la page se recharge a chaque fois ?

Merci d'avance pour votre aide,
Bon dimanche,
Patrice.

Re: Besoin d'aide en Javascript

Posté : 19 août 2014, 16:09
par Bakaarion
En fait c'est un carousel que tu cherches, non ? Il y en a des gratuits sur le net, jquery doit avoir des solutions simplifiées pour ça.

Re: Besoin d'aide en Javascript

Posté : 24 août 2014, 12:56
par bulletfigurine
J'ai réussi a faire défiler mes images. Mon probleme c'est que je dois recharger la page a chaque fois et donc ca ralenti énormement le déplacement de mes icones en bas ?!

Voilà ce que ca donne pour le moment :
http://bull100.pagesperso-orange.fr/index.html

Que pourrais je faire pour ne pas recharger la page a chaque fois ?

Patrice.

Re: Besoin d'aide en Javascript

Posté : 24 août 2014, 18:36
par Elie
Bah il t'a dit utilise un caroussel :) et remplace les numero par des images de ton choix ...
Un peu de JS, un peu de PHP et le tour est joué

Moi j'utilise ca : http://bxslider.com/examples/thumbnail-pager-1