J'essais de faire une galerie simple.
Par simple je veux dire qu'il n'y a qu'une seule image d'afficher et un simple clic envoie vers une suivante. (avec éventuellement un préload de la suivante) le tout en boucle (la dernière image renvoie sur la première)
J'ai trouvé énormément de codes source, mais tous sont trop fournis, et j'ai du mal a les modifier
Sur cette galerie j'ai mis 4 catégories,
catégorie 1 = image 1 a 5
catégorie 2 = image 6 a 10
catégorie 3 = image 11 a 15
catégorie 4 = image 16 a 20
Est il possible qu'en cliquant dans le menu sur la catégorie 2 la galerie commence a l'image 6 puis suive sont cours jusqu'a la dernière image (qui renvoie ensuite vers la première) ???
ah ?
donc on commence à 6 on va jusqu'à 20, puis on recommence à 1 ?
curieux, mais bon...
si tu appelles tes images 1.jpg,2.jpg.... 20.jpg
au click sur le bouton suivant :
"il suffit" de gérer un compteur et de changer le src
par le résulat du calcul+".jpg"
par exemple avec les images 0.jpg à 4.jpg
<script>
var i=document.getElementById("i");
function trait()
{ var tmp=i.alt;
tmp++;
i.alt=tmp;
i.src=Math.floor(i.alt%5)+".jpg";
}
</script>
tu adapteras pour de 6 à 20 puis 1, ou 11 à 20 puis 1....
"il suffit" d'initialiser le alt.
( j'ai mis le compteur dans le alt, on peut utiliser une variable globale )
bonjour,
>>Est il possible qu'en cliquant dans le menu sur la catégorie 2
>>la galerie commence a l'image 6 puis suive sont cours jusqu'a
>>la dernière image (qui renvoie ensuite vers la première) ???
euh... oui ?
encore faut-il :
savoir ce qu'est le menu de la catégorie 2
connaitre le nom de l'image 6, de la 7...
et si la dernière image c'est la 10 ou la 20
>>avec éventuellement un préload de la suivante
très souvent nuisible, mais ici ce serait
simplement totalement inutile
savoir ce qu'est le menu de la catégorie 2
=> catégorie2 ca sera images/dessin un truc comme ca, le nom je ne suis pas fixée
connaitre le nom de l'image 6, de la 7...
=> les noms d'images seront genre 6.jpg ou 7.jpg (il n'apparaitrons nul part)
et si la dernière image c'est la 10 ou la 20 => la dernière est 20 et redirige vers la première (20.jpg => 1.jpg)
ok ! super, je vais faire comme ça.
bon par contre je crois que je devrais faire une iframe pour les catégorie, vu que le code devra être différent.
(si la personne sarrette a l'image 3.jpg de la catégorie 1, et qu'il clic sur catégorie2 forcément il faudra générer un code qui charge de 6 a 10 par exemple)
puis pour passe de la 20 a la 1 je trouverais bien comment changer ca.
>>je devrais faire une iframe pour les catégorie, vu que le code devra être différent
bah...
à l'appel met quel n° où commencer : trait(1) ou trait(6) ....
dans la fonction met un paramètre trait(debut)
et commence par initialiser alt ou la variable compteur à cette valeur
@+
Une seul image est visible a la fois.
pour initialiser la variable compteur j'ai bien compris, pas de soucis.
par contre je ne comprend pas ce que tu veux dire par "à l'appel met quel n° où commencer : trait(1) ou trait(6)" ?
dans l'exemple mis, ça commence à 0.
tu voudrais pouvoir commencer à 1, à 6, à 11, à 16,
tu as donc obligatoirement 4 appels à la fonction,
donc donne la valeur de départ à l'appel 1,6,11 ou 16
pour commencer là où tu veux, et initialise le alt ou
le compteur à cette valeur.
Salut !!
le code marche très bien !
en fait j'ai intégré le onclick a l'image ca donne ce qui est en dessous.
enssuite j'ai ajouté un lien externe pour passer de la 1er image a l'image 5 directement mais ca ne marche pas, ais-je mal initialisé le alt ?
Catégorie 2
<script>
var i=document.getElementById("i");
function trait()
{ var tmp=i.alt;
tmp++;
i.alt=tmp;
i.src=Math.floor(i.alt%12)+".jpg";
}
</script>
Salut !
Génial !
Voici ce que j'ai utilisé comme code pour tester.
[javascript:void(appel5()); aller directement a l'image 6]
<script>
function appel5()
{ i.alt='5';
trait();
}
</script>
[javascript:void(appel7()); aller directement a l'image 8]
<script>
function appel7()
{ i.alt='7';
trait();
}
</script>
<script>
var i=document.getElementById("i");
function trait()
{ var tmp=i.alt;
tmp++;
i.alt=tmp;
i.src=Math.floor(i.alt%11)+".jpg";
}
</script>
après la dernière image, la première reprise, donc j'ai bien des boucles.
sous FireFox cela fonctionne très bien, les images se chargent immédiatement.
sous IE je suis obligée de cliquer plusieurs fois (2 en fait) ou d'attente que le commentaire s'affiche sur l'image, ce qui n'est pas très sexy.
Voici ce que ca donne:
