Bonjour à tous !
Voilà j'ai trouvé un script en JS qui permet d'avoir un diapo photo automatique et aléatoire. Je l'ai inclus dans une <div> et il tourne sur ma page web. Seulement pour plus de propreté, j'ai séparé l'HTML, le CSS et le JS dans des fichiers différents. Et depuis, le diapos ne fonctionne plus sur IE (sous FF ça marche tjs !).
Voilà mes différents bouts de code.
l'HTML :
et le Javascript :
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23 <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <style type="text/css" media="all">@import "style.css";</style> <title>Le site des sourciers</title> <script language="JavaScript1.2" src="/JS/changeImg.js"></script> </head> <body> <div class="bloc_centre"> <div class="diapo"> <img name="imgalea" id="imgalea" src="/themes/diapo/TN_img1.jpg" style="filter:progid:DXImageTransform.Microsoft.Fade(Duration=1.0,overlap=1.0)"> <script language="JavaScript1.2">changeimage()</script> </div> <div class="bann"><img src="/themes/bann.png" alt="" width="200" height="150"></div> <div class="texte"></div> <div class="menu"> <?php include ("menu.htm"); ?> </div> </div> </body> </html>
Le fonctionnement est simple : j'ai un dossier diapos qui contient toutes les images du diapos. Elles sont nommées ainsi : TN_img + un nombre n compris entre 1 et le nombre de photos. Le script va lire dans le dossier et afficher aléatoirement les images. Sous IE j'ai une image fixe : TN_img1 (la première photo du dossier)
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29 // JavaScript Document // change image var prefix='/themes/diapo/TN_img' var extension='jpg' var nbimages=9 var delai=5000 var lasti=0, newi=0 function changeimage() { newi=Math.floor(nbimages*Math.random()+1) if(newi==lasti) changeimage() else { lasti=newi if(document.getElementById) o=document.getElementById('imgalea'); else if(document.images) o=document.images.imgalea; if(o) { if(o.filters) o.filters[0].apply(); o.src=prefix+newi+'.'+extension if(o.filters) document.getElementById('imgalea').filters[0].play(); } setTimeout("changeimage()",delai) } }
J'ai vérifé les chemins et normalement c'est bon...
Partager