Attendre le chargement d'un object nouvellement rendu visible?
Bonjour,
Voici un code tout bête supposé me permettre de montrer le trailer d'un film lorsque l'image est cliquée :
Le player (un swf trouvé sur le net) est dans un <div> caché qui est révélé au moment ou l'utilisateur clique sur la photo.
A ce moment la fonction showPlayer(url) est appelée et le block div caché est rendu visible.
Le problème c'est que le code juste après
document.getElementById('playerDiv').style.display = 'block';
ne fait pas son effet, au 2e clic cela fonctionne.
Je suis à peut prêt sur que c'est parce que le SWF n'est pas chargé au moment ou ces fonctions sont appelées, elles ont donc pas d'effet.
Est-ce qu'il y aurait une solution pour laisser le temps au swf de se charger et brancher une sorte de callback me permettant d'interagir dessus? Ou y'a-t-il une meilleure solution?
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
46
47
48
49
50
51
52
| <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title></title>
<script language="javascript" type="text/javascript">
function showPlayer( trailerUrl )
{
//make the player block visible
document.getElementById('playerDiv').style.display = 'block';
//give the movie URL and start
document.getElementById("playerObject").SetVariable("player:jsStop", "");
document.getElementById('playerObject').SetVariable("player:jsUrl", trailerUrl );
document.getElementById('playerObject').SetVariable("player:jsPlay", "");
}
</script>
</head>
<body>
<div id="ads">
<table>
<tr>
<td>
<a href="javascript:showPlayer( 'http://localhost:8085/MovieCounter/GetMovieUri?movieId=500' )" >
<img src="Icons/195.jpg" alt="" />
</a>
</td>
<td>
<p>Click on the image to play the trailer</p>
</td>
</tr>
</table>
</div>
<!-- player div -->
<div id="playerDiv" style="display:none; height: 0px; margin : 10px 0 0 0" >
<object id="playerObject" type="application/x-shockwave-flash" data="player_flv_maxi.swf" width="400" height="300" >
<param name="movie" value="player_flv_maxi.swf" />
<param name="FlashVars" value="showstop=1&showvolume=1&showtime=1&title=Preview&showplayer=always;width=400&height=300" />
</object>
</div>
</body>
</html> |
