Bonjour a tous
Je réalise mon premier site avec mes quelque connaissances (un peu de html et rien du tout en javascript).
J'ai récupéré la galerie de photo de ce tuto http://www.alsacreations.com/tuto/lire/557-galerie-photo-javascript.html
Elle me plaie beaucoup mais durant le chargement de l'image rien n’indique l'utilisateur que l'image charge. Celui ci a alors tendance a cliquer sur la suivante pensant que ça n'a pas marcher.
L’idée serai de faire afficher une image ,qui affiche "chargement", très légère en attend que la grande soit charger
J'ai fait des essai en ajoutant big_photo.src = chargement.jpg; dans la boucle mais ca ne marche pas.
Si quelqu'un peut me dépatouiller je lui serai très reconnaissant.
si ça vous intéresse voila le site en question pour les chambre d’hôte de mes parents (encore en chantier et loin d’être parfait) http://perso.nordnet.fr/jeanmarie.delcamp/[/i]
Modifié par Arnoz (15 Apr 2011 - 01:05)
Je réalise mon premier site avec mes quelque connaissances (un peu de html et rien du tout en javascript).
J'ai récupéré la galerie de photo de ce tuto http://www.alsacreations.com/tuto/lire/557-galerie-photo-javascript.html
Elle me plaie beaucoup mais durant le chargement de l'image rien n’indique l'utilisateur que l'image charge. Celui ci a alors tendance a cliquer sur la suivante pensant que ça n'a pas marcher.
L’idée serai de faire afficher une image ,qui affiche "chargement", très légère en attend que la grande soit charger
J'ai fait des essai en ajoutant big_photo.src = chargement.jpg; dans la boucle mais ca ne marche pas.
function displayPics()
{
var photos = document.getElementById('galerie_mini') ;
// On récupère l'élément ayant pour id galerie_mini
var liens = photos.getElementsByTagName('a') ;
// On récupère dans une variable tous les liens contenu dans galerie_mini
var big_photo = document.getElementById('big_pict') ;
// Ici c'est l'élément ayant pour id big_pict qui est récupéré, c'est notre photo en taille normale
var titre_photo = document.getElementById('photo').getElementsByTagName('dt')[0] ;
// Et enfin le titre de la photo de taille normale
// Une boucle parcourant l'ensemble des liens contenu dans galerie_mini
for (var i = 0 ; i < liens.length ; ++i) {
// Au clique sur ces liens
liens[i].onclick = function() {
//j'imagine qu'il faut ajouter qqc ici comme big_photo.src = chargement.jpg; mais...
big_photo.src = this.href; // On change l'attribut src de l'image en le remplaçant par la valeur du lien
big_photo.alt = this.title; // On change son titre
titre_photo.firstChild.nodeValue = this.title; // On change le texte de titre de la photo
return false; // Et pour finir on inhibe l'action réelle du lien
};
}
}
window.onload = displayPics;
// Il ne reste plus qu'à appeler notre fonction au chargement de la page
Si quelqu'un peut me dépatouiller je lui serai très reconnaissant.
si ça vous intéresse voila le site en question pour les chambre d’hôte de mes parents (encore en chantier et loin d’être parfait) http://perso.nordnet.fr/jeanmarie.delcamp/[/i]
Modifié par Arnoz (15 Apr 2011 - 01:05)