Aide pour diaporama automatique + miniature

[spankey]

Bonjour

Je dois réalisé un diaporama d'images qui défilent,
le tout avec avec les miniatures des photos juste au dessus pour aller à la
photo souhaiter, mais j'ai des contraintes techniques (interdiction
de l'utilisation de jquery entre autre).

http://img852.imageshack.us/img852/6784/imagegde.jpg

Mais je ne pas sais réellement comment écrire ca pour tout faire
coïncider.
J'ai réussi a faire un diaporama avec le timmer mais sans que les
miniatures fonctionne et un autre avec les miniatures mais sans le timmer.

Est-ce que vous pourriez m'indiquer la démarche à entreprendre pour le réaliser.

Merci d'avance
Spankey

Edit: J'ai bien entendu aussi chercher en long et en travers un script adéquat sans résultats..

[nadox]

Bonjour,

Qu'est ce qui ne fonctionne pas exactement ?

Quel est ton algorithme ? (que fais ton code ?)

Tu n'aurais pas un peu de code à nous montrer ?

[spankey]

Merci pour ta réponse

Code :

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
var actuEnCours = -1;
 
 
function remplacer()
{
	// Si on a une actu en cours alors on la masque
	if (actuEnCours != -1)
	{
		document.getElementById("actu" + actuEnCours).style.display = "none"
	}
 
	var e=null;
	while (e==null){
		actuEnCours=Math.round(Math.random()*10);
			e=document.getElementById("actu"+actuEnCours);
	}
 
	// Affichage de la nouvelle actu en cours
	var e = document.getElementById("actu" + actuEnCours);
	e.style.display = "block";
 
	// Programme le prochain appel
	setTimeout("remplacer()", 3000);
}

La par exemple je ne sais pas comment, si j'écris une nouvelle fonction faire en sorte de faire fonctionner les miniatures..

Code :

1
2
3
4
5
6
7
8
9
10
11
12
      // Fonction pour afficher l'image de détail de la miniature 
      function afficherDetail(url)
      {
        // Pointeur vers le DIV conteneur de l'image
 
			        var monDiv = document.getElementById("divAffichage");
 
 
        // Modification du HTML du div conteneur
        monDiv.innerHTML = "<img src=\"" + url + "\" alt=\"\"/>";
 
	  }

Et ce code la me parait absurde pour y insérer un timmer sur les images.

Ce que je souhaiterais, c'est lié les deux..

[nadox]

Ce code fonctionne vraiment ?

Tu déclare deux fois une même variable 'e'
De plus, le nom de variable e est à éviter car elle est utilisée par certains navigateur.

Je crois que je ne comprends pas bien ce que tu veux faire...

Dans l'idée, le timer sert à avoir une sorte de boucle.
Que veux-tu faire exactement dans cette boucle ?

[spankey]

Ce que je souhaiterais faire c'est afficher une photo sur un temps donnés, pendant 3 secondes par exemple.

C'est ce que j'ai fait sur le premier script. Ce que je n'arrive pas a faire, c'est écrire une nouvelle fonction qui permet d'afficher une photo à la place de celle en cours en cliquant sur une miniature.

[nadox]

Tu n'as pas besoin d'écrire une nouvelle fonction, mais d'adapter la première.

Au lieu d'afficher/masquer ton img à chaque tour du timer, il faut 'parcourir' les miniatures et afficher la miniature courante en dessous (par exemple grace à ta deuxième fonction).

Ensuite pour pouvoir afficher l'image sur le clic(toujours avec ta deuxième fonction), il faut simplement 'brancher' ta fonction d'affichage avec le click sur les miniatures.

[spankey]

Au lieu d'afficher/masquer ton img à chaque tour du timer, il faut 'parcourir' les miniatures et afficher la miniature courante en dessous (par exemple grace à ta deuxième fonction).

Que veux-tu dire par " 'parcourir' "..
honnêtement n'étant pas dev, je ne vois pas quelle sont modification a entreprendre, mise a part pour le " 'branchement' " et je ne voudrais pas faire d'erreur de synthaxe.

[nadox]

Honnêtement, n'étant pas utilisateur, je ne vois pas ce qui fait peur
Non, plus sérieusement.
Ta fonction actuelle fait ceci dans un timer :
1- masque l'image affichée, si il y en a une.
2- si il n'y en a pas encore eu, en choisi une au hasard.
3- affiche l'image suivante.

La modification consiste a garder les différentes étapes, mais les améliorer.
2- si il n'y en a pas encore eu, en choisi une au hasard.
3- affiche/remplace l'image par la miniature.

Pour cela, tu peux faire.

Avec une liste des miniatures avec des balises img et une balise img en dessous :

Code :

1
2
 
document.getElementById("ma_grosse_image").src=document.getElementById("ma_miniature"+indice).src;

[spankey]

J'essayerais ta méthode tout à l'heure, merci bien !