Compatibilité IE8 (html ou js ?)

Bonjour
Je ne sais pas si cette question concerne HTML ou JS. Il fallait faire un choix, je l'ai mise ici.
J'ai deux vidéo à afficher alternativement par un clic sur une image ou un texte.
La vidéo, son texte de présentation et le lien vers l'autre vidéo sont dans un div qui est alternativement en display none ou display block.

Voici le code HTML :

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
<div id="video_01">
	Lors du séminaire "<b>Les Ténors de la Supply Chain</b>" organisé par le CNAM le 2 Avril 2009, <b>Alexandre ROOT</b>, Directeur de la société PLANIPE, intervient dans une table ronde au sujet des Systèmes d'Information. Il <b>détaille les spécificités</b> de la solution <b>PLANIPE</b>.
	<br /><br />
	<div class="image_centre">
		<object type="application/x-shockwave-flash" data="../video/player_flv_maxi.swf" width="304" height="174">
			<param name="movie" value="../video/player_flv_maxi.swf" />
			<param name="quality" value="high" />
			<param name="FlashVars" value="flv=../video/root-01.flv&startimage=../video/root-01.jpg&showvolume=1" />
		</object> 
	</div>
	<br /><br />
	Le 23 avril 2010, <b>PLANIPE</b> a participé à la table ronde "<b>Supply Chain Meter</b>"
	<br />
	<span onclick="change_video(1);" style="cursor:pointer;">
		<img src="../images/triangle.gif" /> voir la vidéo
	</span>
</div>
 
<div id="video_02">
	<b>ICI</b> le texte de présentation de la table ronde du 23 avril 2010 (à me faire parvenir, svp).
	<br /><br />
	<div class="image_centre">
		<object type="application/x-shockwave-flash" data="../video/player_flv_maxi.swf" width="304" height="171">
			<param name="movie" value="../video/player_flv_maxi.swf" />
			<param name="quality" value="high" />
			<param name="FlashVars" value="flv=../video/root-02.flv&startimage=../video/root-02.jpg&showvolume=1" />
		</object> 
	</div>
	<br /><br />
	Le 2 avril 2009, <b>PLANIPE</b> a participé à la table ronde "<b>Les Ténors de la Supply Chain</b>"
	<br />
	<span onclick="change_video(2);" style="cursor:pointer;">
		<img src="../images/triangle.gif" /> voir la vidéo
	</span>					
</div>

Et voici le code JS :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
// Affichage des vidéos "dernière actu"	
function change_video(video_affichee) {
	if (video_affichee==1)
		{
		document.getElementById('video_01').style.display='none';
		document.getElementById('video_02').style.display='block';
		}
	if (video_affichee==2)
		{
		document.getElementById('video_02').style.display='none';
		document.getElementById('video_01').style.display='block';
		}
	return;
	}

Cette solution fonctionne correctement avec Firefox et Safari mais pas avec IE version 6 ou 7 : quand on clique sur le lien de la première page affichée, un carré vide est affiché à la place de la seconde vidéo.

Pour visualiser ce problème : http://www.planipe.com/tests/accueil.html

Merci pour vos conseils