Script avec fondu dans diaporama

**Erickeee** · 15/02/2013, 23h10

bonjour à tous,
en référence à cette discussion saut d'image avec fondu dans diaporama

Je suis à la recherche d'un script comme on l'a décrit plus haut dans la conversation.
Le tout premier écrit par hellspawn_ludo m'a semblé très bien et fonctionnait parfaitement bien jusqu'au moment où j'ai essayé d'ajouter plus que 3 images...
j'ai cru qu'il suffisait simplement d'ajouter une ligne (en faisant attention à bien incrémenter le "TabImg", mais cela n'a pas fonctionné...
j'ia essayé de chipoter au reste du code pour voir si ca bloquait autre part, mais je suis un peu perdu là, je ne trouve pas la solution qui doit surement être simple.

quelqu'un pourrait-il m'aider?

Pour l'instant, le code de ma page ressemble à ca :

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
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
<html>
 
 
<head>
 
<script>
TabImg = new Array;
 
// Nom des images jouées
TabImg[0] = '01.jpg'
TabImg[1] = '02.jpg'
TabImg[2] = '03.jpg'
TabImg[3] = '04.jpg'
TabImg[4] = '05.jpg'
TabImg[5] = '06.jpg'
 
num = 0;
 
function diaporama(divid, imageid, millisec) 
{ 
  var speed = Math.round(millisec / 1000); 
  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)",1000);
  </script>
 
 
</head>
 
 
 
 
<body>
 
l'aimage s'affiche ic : 
 
<br /><br />
 
 
 
<div  id="id_div" style="background-image: url('01.jpg');background-repeat: no-repeat; width: 250px; height: 250px;">
 
    <img id="id_img" src="" style="width: 250px; height: 250px;background-repeat: no-repeat; border: 0 none; filter: alpha(opacity=0); -moz-opacity: 0; opacity: 0;"  />
 
</div>
 
 
 
 
</body>
</html>

**NoSmoking** · 16/02/2013, 07h13

Bonjour,
il existe également Galerie avec effet de fondu

**Erickeee** · 16/02/2013, 15h53

Bonjour,
merci pour la réponse.
Effectivement, ca pourrait être intéressant.
Je pourrais partir de ca comem base et essayer de le faire défiler de manière automatique sans avoir les boutons. Mon but est que les images défilent sans avoir d'interaction de la part du visiteur.

Où pourrais-je trouver le code de cette page pour qu eje puisse voir ca d'un peu plus pres?

**Erickeee** · 16/02/2013, 15h57

ha, je viens de voir que le code source de la page suffit...
Je vais donc tester de le faire défiler de manière automatique.

Script avec fondu dans diaporama

JavaScript

Discussions similaires

Partager

Partager