Bonjour à tous.
Sur mon site je dispose d’une catégorie jeux. Dans cette catégorie on retrouve différent jeux, avec des vidéos, des dates et infos, mais aussi des screenshots. Actuellement la solution consiste à cliquer sur le lien “43 screenshots” par exemple, ce qui a pour effet d’ouvrir une fenêtre en pop-up et de faire défiler les screenshots automatiquement.
Tous les échos qui me reviennent de ce système sont les mêmes: le défilement automatique n’est pas apprécié, les gens se lassent et n’attend pas la fin. De plus suivant la connection dont dispose le visiteur le temps de chargement des images n’est pas le même, certains ont donc à peine le temps de les voir, et si je passe le timing a plus de 10 secondes, tout le monde se plaint. C’est pour cette raison que je souhaite utiliser un autre système de défilement où ce sera l’utilisateur qui décidera lui même de faire défiler les screens. Sachant que j’ai volontairement limité la taille de toutes les images au format 1024*768, afin de les ouvrir dans une page à ce format, et que je ne dispose pas de place supplémentaire, j’ai pensé qu’il pourrait être judicieux d’instaurer un système de défilement au clic. Dès que le visiteur veut faire défiler les screens il clique sur l’image et cela passe à la suivante. Ainsi plus de problème de timer. Seulement je n’ai strictement aucune idée pour coder ceci. Je peux par contre vous montrer le code actuel qui est utilisé pour faire défiler les images afin que l’on incorpore le nouveau code pour le défilement.
Merci à vous, amicalement
Dans un premier temps, tu peux essayer d’aérer ton charabia histoire qu’on te lise mieux 
Sinon, si t’arrive à faire défiler automatiquement, je vois pas pourquoi t’arrives pas à foutre un lien sur l’image pour que dés que l’utilisateur clique dessus il aille à la suivante?
Concrètement :
<a href="machin…"><img src="///" alt="" /></a>
Je vois pas de problème, là
Merci d’avoir répondu. Mais si j’applique ta technique je dois mettre un lien sur chaque image qui renverrai vers la suivante. Le problème est que je ne sais pas si cela s’ouvrirait dans une autre fenêtre et c’est plutôt lourd à gérer si tu à plus de 150 screenshots.
Ce qui serait l’idéal: une fonction javascript. Je rentre le nom de toute les images et ensuite on introduit la gestion du clic. A chaque clic on affiche l’image qui est rattaché au numéro suivant. Mais comment gère t-on le clic en javascript. Comment peut il être détecté et qu’ensuite on incrémente le numéro d’image et qu’on l’affiche.
Merci pour votre aide
EDIT: voici à quoi ressemble le code actuellement pour que cela soit plus clair pour vous et modifiable plus facilement:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Screenshots Crysis - défilement automatique</title>
<script>
var imgs=new Array();
imgs[0]="illustrations/jeux/crysis0.jpg";
imgs[1]="illustrations/jeux/crysis1.jpg";
imgs[2]="illustrations/jeux/crysis2.jpg";
imgs[3]="illustrations/jeux/crysis3.jpg";
......................................................
imgs[42]="illustrations/jeux/crysis42.jpg";
imgs[43]="illustrations/jeux/crysis43.jpg";
imgs[44]="illustrations/jeux/crysis44.jpg";
imgs[45]="illustrations/jeux/crysis45.jpg";
imgs[46]="illustrations/jeux/crysis46.jpg";
imgs[47]="illustrations/jeux/crysis47.jpg";
imgs[48]="illustrations/jeux/crysis48.jpg";
var cpt=0;
function changeimages()
{
document.getElementById("ima").src=imgs[cpt];
cpt++;
if(cpt>=imgs.length) cpt=0;
setTimeout("changeimages()",10000);
}
</script>
</head>
<body onLoad="changeimages()">
<p align="center">
<img id="ima" name="ima" alt="" align="center" />
</p>
<p align="center"><span style="font-size: 28pt">Défilement automatique</span></p>
</body>
</html>
Ah ben dans ce cas : <img onclick="changeimages();" … />
en virant ton timeout.
Oula, je ne vois pas comment faire. Ce script je l’ai récupéré et quelques peut adapté. J’ai essayé de le comprendre un peu tout de même, je n’exécute pas n’importe quoi.
Pourrez tu écrire la petite portion de code nécessaire pour gérer le clic, et lorsque celui-ci est détecter passer à l’image suivante. :neutre:
J’ai aussi eu une autre idée, si la personne se trompe, qu’elle puisse revenir à la précédente, mais par un clic droit cette fois.
En tout cas merci de ton aide, ça fait plaisir de se sentir aidé.
<img onclick="changeimages();" id="ima" name="ima" alt="" align="center" />
Da.
function changeimages()
{
document.getElementById("ima").src=imgs[cpt];
cpt++;
if(cpt>=imgs.length) cpt=0;
}
Da, bis.
Merci beaucoup ça marche. Mais je suis têtu. Je ne comprends pas comment cela marche. Est-il possible que tu m’expliques. Cela me sera bien utile, déjà pour mes conaissances et je compte mettre ce bout de code en astuces sur mon site, car toutes mes recherches sur le sujet n’ont pas vraiment abouties.
Pour cela ce n’est pas urgent, on pourra voir demain
Merci encore à toi 
c’est simple, le on click dans ton image lance la fonction changeimages() de ton javascript.
Dans la partie javascript, tu récupère le huméro de l’image actuelle, tu rajoutes 1, ce qui te donne le numéro de la suivante. Ensuite tu va charger l’image suivante avec ce que tu viens de calculer
enjoy :hello:
Je pense que tu comprendras mieux en lisant cela :
http://www.w3.org/TR/html4/interact/scripts.html#h-18.2.3
http://developer.mozilla.org/fr/docs/Guide_JavaScript_1.5
Non, non C’est juste la doc javascript & html (pour le reste, le message d’InSiderZ est suffisant)
Merci à tous les deux.
J’ai lu les pages vers lesquelles tu me renvoyais, ça éclairci les choses!
Cependant je ne comprend pas tellement comment fonctionne le javascript, je n’ai déjà pas les bases… je préférais le C.
En tout cas merci beaucoup à vous, et bonne fêtes de fin d’année.
Amicalement