Code javascript compatible FF mais incompatible IE & Chrome?
Bonsoir chers amis de Developpez ! :)
Voilà j'ai un petit problème ! Sur ma page html ci-dessous, j'ai un lecteur embarqué allociné (flash), j'ai placé dans un select les différentes bandes annonces disponibles pour un film par exemple. Et quand on choisis une vidéo dans le select, le code javascript se charge de changer la source de l'animation flash. Ce qui sous Firefox permet de changer dynamiquement de vidéo sans recharger notre page. Mais je viens de me rendre compte que ce code en question ne marchais pas ni sur Google Chrome ni sur Internet Explorer (Derniers versions).
Auriez vous des suggestions et/ou remarques afin de le rendre compatible et/ou améliorer le code utilisé ?
Voici le code html de la page:
Code:
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
| <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Document sans nom</title>
</head>
<body>
<!-- On met un onchange() sur le select.
Il sera déclenchée à chaque fois que la valeur du selectionnée est modifiée.
Lors de cet événement, on appelle la fonction change_param() avec en paramètre
le value de l option sélectionnée. -->
<select name="bande_annonce" size="1" onchange="change_param(this.value);">
<option value="18733395">Die Hard 4 - retour en enfer - Bande-annonce 1 (Français)</option>
<option value="18733396">Die Hard 4 - retour en enfer - Bande-annonce 1 (Anglais sous-titré)</option>
<option value="18733397">Die Hard 4 - retour en enfer - Bande-annonce 2 (Anglais sous-titré)</option>
<option value="18733398">Die Hard 4 - retour en enfer - Bande-annonce 3 (Français)</option>
</select>
<div id="allocine_blog" style="width:625px; height:494px">
<object width="100%" height="100%">
<param name="movie" value="http://www.allocine.fr/blogvision/18733395" /></param>
<param name="allowFullScreen" value="true" /></param><param name="allowScriptAccess" value="always" /></param>
<param name="wmode" value="opaque" /></param>
<embed src="http://www.allocine.fr/blogvision/18733395" type="application/x-shockwave-flash" width="100%" height="100%" allowfullscreen="true" allowscriptaccess="always" wmode="opaque"></embed>
</object>
</div>
<script type="text/javascript">
// Ici, on définit la fonction change_param()
function change_param(valeur) {
// D'abord, on récupère l'élément <object> qu'on désire modifier.
// Ici, c'est le premier <object> dans l'élément ayant pour id "allocine_blog"
var obj=document.getElementById('allocine_blog').getElementsByTagName('object')[0],
// On crée ensuite une chaîne ; la concaténation de l'adresse avec la valeur passée en paramètre
url='http://www.allocine.fr/blogvision/'+valeur;
// A partir de l'<object>, on récupère le "src" du premier <embed> et on lui attribue la chaîne
obj.getElementsByTagName('embed')[0].src=url;
// Même chose pour le "value" du premier <param>
obj.getElementsByTagName('param')[0].value=url;
}
</script>
</body>
</html> |
Merci d'avance, votre aide est précieuse ! :weird:
