Changer de vidéo sans recharger la page
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:
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 ?
