Ptite_Perle
A les clefs du forum
Je tiens le trousseau de clefs du forum
Fondatrice Messages : 5862 Venue : 27/06/2009 Je suis : Age : 60 Je vie à : Lyon Humeur : Bonne humeur Mes Points : 121048 Agrandir plusieurs images au clic | | Agrandir plusieurs photos d'un simple clic . Code proposé pour 4 images. Faire deux modèles de chaque image : 1 grande - 1 petite Le script à mettre sur votre code html - Code:
-
<!-- DEBUT DU script --> <script LANGUAGE="Javascript"> <!--script --> /****** DEFINITION DES VARIABLE DU script ******/ nb_photo_ligne = 4; numero_photo = 1;
/****** ENREGISTREMENT DES PHOTOS ******/ ejs_vignet = new Array; ejs_des = new Array; ejs_big = new Array;
var HazMess=new Array(); ejs_des[0]= 'Cliquez sur la photo ci-dessus pour la faire disparaître ' ejs_vignet[0]= ' photo1 sous forme de vignette' ejs_big[0]= ' photo1 grande taille' ejs_des[1]= ' Inserer ici votre texte de présentation ' ejs_vignet[1]= ' photo2 sous forme de vignette' ejs_big[1]= ' photo2 grande taille' ejs_des[2]= 'Insérer ici le nom de la photo' ejs_vignet[2]= ' photo3 sous forme de vignette' ejs_big[2]= ' photo3 grande taille' ejs_des[3]= 'Insérer ici la date ou tout autre..' ejs_vignet[3]= ' photo4 sous forme de vignette' ejs_big[3]= ' photo4 grande taille'
/****** FONCTION POUR CHANGER LES PHOTOS ******/ function ChageImage(num) { if(document.getElementById) document.getElementById("ejs_dyn_img").innerHTML = '<A HREF="javascript:killImage()"><IMG SRC="'+ejs_big[num]+'" BORDER=0 HSPACE=5 VSPACE=5 ALT="Cliquez ici pour faire disparaitre"></A><BR><FONT FACE="Verdana, Arial" SIZE=1>'+ejs_des[num]+'</FONT>'; else window.open(ejs_big[num],"_blank") }
/****** FONCTION POUR EFFACER LES PHOTOS ******/ function killImage(num) { if(document.getElementById) document.getElementById("ejs_dyn_img").innerHTML = ""; }
/****** CREATION DU TABLEAU ******/ document.write('<TABLE>') for(a=0;a<ejs_big.length;a++) { if(numero_photo == 1) document.write('<TR>'); if(numero_photo == ejs_big.length) document.write('<TD ALIGN=center COLSPAN='+(((ejs_big.length)+1)-numero_photo)+'>'); else document.write('<TD ALIGN=center>'); document.write('<A HREF="javascript:ChageImage('+a+')"><IMG SRC="'+ejs_vignet[a]+'" HSPACE=5 VSPACE=5 ALT="Cliquez ici pour voir en grand" BORDER=0></A></TD>') if(numero_photo == nb_photo_ligne) { document.write('</TR>'); numero_photo=0; } numero_photo++; } document.write('<TR><TD COLSPAN='+ejs_big.length+' ALIGN=center><DIV ID=ejs_dyn_img></DIV></TD></TR></TABLE>'); </script> <!-- fin DU script -->
nb_photo_ligne = 1 nombre de photo (1 grande et 1 petite comptant pour 1) ejs_vignet[0]= ' photo1 sous forme de vignette' ejs_big[0]= ' photo1 grande taille' Exemple ou mettre l'url de vos images : ejs_vignet[0]= ' Url de votre petite photo' ejs_big[0]= ' Url de votre grande photo' Pensez à la largeur de votre colonne centrale, vous ne pourrez pas mettre 10 photos côte à côte. Si vous voulez rajouter 1 paire de photo, vous modifiez :nb_photo_ligne = 4; en nb_photo_ligne = 5; Vous pouvez rajoutez une paire de ligne : ejs_vignet[5]= ' photo5 sous forme de vignette' ejs_big[5]= ' photo5 grande taille' |
| |