Bonjour à tous,

Mon problème est le suivant :

Je fais un site internet sur lequel une vidéo sera affichée au centre en grand. En dessous de cette vidéo plusieurs images qui correspondent elles même à d'autres vidéo. Mon objectif serait qu'en cliquant sur une de ces images, la vidéo change sans recharger la page.

J'ai fait ça de cette façon :

Code html : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
<div id="video">
	<video class="video-js vjs-default-skin"
  		controls preload="auto" width="768" height="700"
  		data-setup="{"example_option":true}">
 		<source id="video1" src="media/video0.mp4" type='video/mp4' />
	</video>
</div>
<div id="listeImages">
	<a onclick="javascript:change()"><img id="img1" src='media/test.jpg' style="height:200px; width:200px;"></img></a>
	<script>
                function change()
                {
                        document.getElementById('video1').src='media/video1.mp4';
                }
</script>

le changement de src se fait bien mais la vidéo elle ne change pas...

quelqu'un aurait une idée ?