Bonjour,

J'ai trouvé et ai adapté une fonction sur internet qui permet de jouer des images façon diaporama. Au moment du changement des images, il y a un effet de fondu.

Sous IE7, aucun problème de fonctionnement mais je ne peux pas en dire autant avec FF. En effet, après avoir joué la 1ère série des 3 images, mon indice (nommé : num) est réinitialisé afin de rejouer les photos mais au moment des transitions, il y a une sorte de saut d'image.

Voici mon code

SCRIPT
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
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
 
 
TabImg = new Array;
 
// Nom des images jouées
TabImg[0] = 'Images/02aft.jpg'
TabImg[1] = 'Images/03aft.jpg'
TabImg[2] = 'Images/04aft.jpg'
 
num = 0;
 
function diaporama(divid, imageid, millisec) 
{ 
  var speed = Math.round(millisec / 100); 
  var timer = 0; 
 
  document.getElementById(divid).style.backgroundImage = "url(" + TabImg[num] + ")"; 
 
  changeOpac(0, imageid); 
 
  if (num>1) 
    {num=-1;}
 
  document.getElementById(imageid).src = TabImg[num+1]; 
 
  for(i = 0; i <= 100; i++) 
  { 
     setTimeout("changeOpac(" + i + ",'" + imageid + "')",(timer * speed)); 
     timer++; 
  } 
 
  num++;
 
}
 
 
  function changeOpac(opacity, id) 
    {
      var object = document.getElementById(id).style;
      object.opacity = (opacity / 100);
      object.MozOpacity = (opacity / 100);
      object.KhtmlOpacity = (opacity / 100);
      object.filter = "alpha(opacity=" + opacity + ")";
    }
 
  //Pour rejouer le diaporama en boucle
  var timer=setInterval("diaporama('id_div','id_img',500)",4000);
et mon code HTML
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
 
 
<div  id="id_div" style="background-image: url('Images/02aft.jpg');background-repeat: no-repeat; width: 800px; height: 600px;">
 
    <img id="id_img" src="" style="width: 800px; height: 600px;background-repeat: no-repeat; border: 0 none; filter: alpha(opacity=0); -moz-opacity: 0; opacity: 0;"  />
 
</div>
Quelqu'un pourrait-il m'expliquer pourquoi à partir de la 2ème série, il y a un saut d'image avec FF alors que sous IE il n'y a rien ?

Merci beaucoup.