Bonjour à tous,
Je suis un petit nouveau et également débutant même si je pense pouvoir me débrouiller un peu en mode bidouille.
Je me suis lancé dans la création d'un site de type portfolio. Il repose sur une grille de 4 colonnes avec un slideshow par projet. Et donc vous le voyez venir, le problème se situe à ce niveau là. J'avais dans un premier temps réussi à faire un slideshow pour un projet et cela me convenait parfaitement mais au moment de placer le 2ème, il y avait un conflit et le code n'était pas adapté. J'ai donc cherché un code qui permet de mettre plusieurs slideshow sur la même page. J'en ai trouvé un qui m'a l'air simple et efficace :
Cela fonctionne bien sauf que j'aimerais faire en sorte que le passage à l'image suivante se fasse par clic et non pas automatiquement grâce à la fonction SetInterval. J'ai cherché toute l'aprem mais je n'ai pas réussi à trouver.
Je vous remercie par avance pour votre aide!
BIGdid
Je suis un petit nouveau et également débutant même si je pense pouvoir me débrouiller un peu en mode bidouille.
Je me suis lancé dans la création d'un site de type portfolio. Il repose sur une grille de 4 colonnes avec un slideshow par projet. Et donc vous le voyez venir, le problème se situe à ce niveau là. J'avais dans un premier temps réussi à faire un slideshow pour un projet et cela me convenait parfaitement mais au moment de placer le 2ème, il y avait un conflit et le code n'était pas adapté. J'ai donc cherché un code qui permet de mettre plusieurs slideshow sur la même page. J'en ai trouvé un qui m'a l'air simple et efficace :
function swapImage(id, path)
{
var el = document.getElementById(id);
el.count = el.count || 0;
el.src = path[el.count];
el.count = (el.count + 1) % path.length;
}
function slideshow() {
setInterval(function () {
swapImage('slideVER', [
"images/VER/VERON1.jpg",
"images/VER/VERON2.jpg",
"images/VER/VERON3.jpg",
"images/VER/VERON4.jpg"
]);
swapImage('slideHOU', [
"images/HOU/HOU1.jpg",
"images/HOU/HOU2.jpg",
"images/HOU/HOU3.jpg",
"images/HOU/HOU4.jpg",
"images/HOU/HOU5.jpg",
"images/HOU/HOU6.jpeg"
]);
swapImage('slideGLA', [
"images/GLA/GLA1.jpg",
"images/GLA/GLA2.jpg",
"images/GLA/GLA3.jpg",
"images/GLA/GLA4.jpg",
"images/GLA/GLA5.jpg",
]);
}, 5000);
}
onload = slideshow;
Cela fonctionne bien sauf que j'aimerais faire en sorte que le passage à l'image suivante se fasse par clic et non pas automatiquement grâce à la fonction SetInterval. J'ai cherché toute l'aprem mais je n'ai pas réussi à trouver.
Je vous remercie par avance pour votre aide!
BIGdid