Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter
Diaporama javascript sous IE
Bonjour à tous,
J'ai récupéré un code javascript pour afficher des photos à partir de miniatures sur mon site. En outre il affiche également un commentaire pour chacune des photos. Le script fonctionne très bien sous Firefox mais pas du tout sous Internet Explorer.
Ce dernier affiche bêtement la photo (taille normale) dans une nouvelle page et sans son commentaire.
L'URL du site : http://perso.orange.fr/VLDE/ (menu photos)
Si quelqu'un a une idée du problème ...
Merci d'avance.
sous IE7, je vois meme pas le contenu de la frame :s
Pour des diaporamas qui en jettent : http://www.dhteumeuleu.com/
Fichier Java manquant
Bonjour,
J'ai oublié de vous donner le code du fichier "script.js" appellé par la page du diaporama :
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() {
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;
et le code Java à l'intérieur de la page web pour afficher le diaporama :
<style type="text/css">
div#galerie
{
width: 100% ;
background: #cccccc ;
border: 2px solid #000 ;
text-align: center ;
font: 0.9em Georgia, serif ;
}
ul#galerie_mini
{
margin: 0 ;
padding: 0 ;
list-style-type: none ;
}
ul#galerie_mini li
{
float: left ;
}
ul#galerie_mini li a img
{
margin: 2px 1px ;
border: 1px solid #000 ;
}
dl#photo
{
clear: both ;
margin: 0 auto ;
}
dl#photo dt
{
font: italic 1.5em/1.5em Georgia, serif ;
color: #0000ff ;
}
dl#photo dd
{
margin: 0 ;
}
dl#photo img
{
border: 1px solid #000 ;
}
</style>
<script type="text/javascript" src="script.js"></script>
<div id="galerie">
<ul id="galerie_mini">
<li><a href="sevre_1/douciniere(1).JPG" title="La Douciniére (1/7)"><img src="sevre_1/douciniere(1)_m.JPG" alt="La Douciniére" /></a></li>
<li><a href="sevre_1/douciniere(2).JPG" title="La Douciniére (2/7)"><img src="sevre_1/douciniere(2)_m.JPG" alt="La Douciniére" /></a></li>
<li><a href="sevre_1/douciniere(3).JPG" title="La Douciniére (3/7)"><img src="sevre_1/douciniere(3)_m.JPG" alt="La Douciniére" /></a></li>
<li><a href="sevre_1/douciniere(4).JPG" title="La Douciniére (4/7)"><img src="sevre_1/douciniere(4)_m.JPG" alt="La Douciniére" /></a></li>
<li><a href="sevre_1/douciniere(5).JPG" title="La Douciniére (5/7)"><img src="sevre_1/douciniere(5)_m.JPG" alt="La Douciniére" /></a></li>
<li><a href="sevre_1/douciniere(6).JPG" title="La Douciniére (6/7)"><img src="sevre_1/douciniere(6)_m.JPG" alt="La Douciniére" /></a></li>
<li><a href="sevre_1/douciniere(7).JPG" title="La Douciniére (7/7)"><img src="sevre_1/douciniere(7)_m.JPG" alt="La Douciniére" /></a></li>
<li><a href="sevre_1/getigne(1).JPG" title="Gétigné - Le moulin à Folon (1/6)"><img src="sevre_1/getigne(1)_m.JPG" alt="Gétigné" /></a></li>
<li><a href="sevre_1/getigne(2).JPG" title="Gétigné - Le moulin à Folon (2/6)"><img src="sevre_1/getigne(2)_m.JPG" alt="Gétigné" /></a></li>
<li><a href="sevre_1/getigne(3).JPG" title="Gétigné - Le moulin à Folon (3/6)"><img src="sevre_1/getigne(3)_m.JPG" alt="Gétigné" /></a></li>
<li><a href="sevre_1/getigne(4).JPG" title="Gétigné - Le moulin à Folon (4/6)"><img src="sevre_1/getigne(4)_m.JPG" alt="Gétigné" /></a></li>
<li><a href="sevre_1/getigne(5).JPG" title="Gétigné - Le moulin à Folon (5/6)"><img src="sevre_1/getigne(5)_m.JPG" alt="Gétigné" /></a></li>
<li><a href="sevre_1/getigne(6).JPG" title="Gétigné - Le moulin à Folon (6/6)"><img src="sevre_1/getigne(6)_m.JPG" alt="Gétigné" /></a></li>
<li><a href="sevre_1/grassetiere(1).JPG" title="La Grassetiére (1/3)"><img src="sevre_1/grassetiere(1)_m.JPG" alt="La Grassetiére" /></a></li>
<li><a href="sevre_1/grassetiere(2).JPG" title="La Grassetiére (2/3)"><img src="sevre_1/grassetiere(2)_m.JPG" alt="La Grassetiére" /></a></li>
<li><a href="sevre_1/grassetiere(3).JPG" title="La Grassetiére (3/3)"><img src="sevre_1/grassetiere(3)_m.JPG" alt="La Grassetiére" /></a></li>
<li><a href="sevre_1/tourniquet(1).JPG" title="Le Tourniquet (1/6)"><img src="sevre_1/tourniquet(1)_m.JPG" alt="Le Tourniquet" /></a></li>
<li><a href="sevre_1/tourniquet(2).JPG" title="Le Tourniquet (2/6)"><img src="sevre_1/tourniquet(2)_m.JPG" alt="Le Tourniquet" /></a></li>
<li><a href="sevre_1/tourniquet(3).JPG" title="Le Tourniquet (3/6)"><img src="sevre_1/tourniquet(3)_m.JPG" alt="Le Tourniquet" /></a></li>
<li><a href="sevre_1/tourniquet(4).JPG" title="Le Tourniquet (4/6)"><img src="sevre_1/tourniquet(4)_m.JPG" alt="Le Tourniquet" /></a></li>
<li><a href="sevre_1/tourniquet(5).JPG" title="Le Tourniquet (5/6)"><img src="sevre_1/tourniquet(5)_m.JPG" alt="Le Tourniquet" /></a></li>
</ul>
<dl id="photo">
<dt> </dt>
<dd><img id="big_pict" src="images/photo1.gif" alt="Cliquez sur les miniatures pour afficher l'image" /></dd>
</dl>
</div>
tu as aussi et surtout oublié de mettre les balises [CODE]...
c'est illisible en l'état
Les fichiers en question ...
Ci-joint le fichier pour afficher le diaporama :
et ci-dessous le "moteur" en javascript script.js
Code : Sélectionner tout - Visualiser dans une fenêtre à part
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
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
Code : Sélectionner tout - Visualiser dans une fenêtre à part
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
Vous avez un bloqueur de publicités installé.
Le Club Developpez.com n'affiche que des publicités IT, discrètes et non intrusives.
Afin que nous puissions continuer à vous fournir gratuitement du contenu de qualité, merci de nous soutenir en désactivant votre bloqueur de publicités sur Developpez.com.
Répondre avec citation
Partager