Lecteur multimédia - YouTube
Pour les vidéos YouTube, le lecteur multimédia s'appuie le lecteur sans interface de YouTube qui s'appuie sur la balise « video
» HTML5 natif.
Le scénario du lecteur multimédia repose sur l'élément « progress
» HTML5 et utilise un polyfill lorsque l'élément n'est pas pris en charge.
Exemple
View code
<figure class="wb-mltmd" data-wb-mltmd='{"shareUrl": "https://www.youtube.com/watch?v=LLg-UsTr7us"}'>
<video title="Suspect">
<source type="video/youtube" src="https://www.youtube.com/watch?v=LLg-UsTr7us" />
</video>
<figcaption>
<p>Suspect</p>
</figcaption>
</figure>
Vidéo Youtube dans une fenêtre modale (lightbox)
View code
<p><a class="wb-lbx lbx-modal lbx-iframe" href="#video-youtube">Ouvrir le vidéo</a></p>
<section id="video-youtube" class="mfp-hide modal-dialog modal-content overlay-def">
<header class="modal-header">
<h3>Vidéo Youtube dans une fenêtre modale (lightbox)</h3>
</header>
<div class="modal-body">
<figure class="wb-mltmd" data-wb-mltmd='{"shareUrl": "https://www.youtube.com/watch?v=LLg-UsTr7us"}'>
<video title="Suspect">
<source type="video/youtube" src="https://www.youtube.com/watch?v=LLg-UsTr7us" />
</video>
<figcaption>
<p>Suspect (<a href="http://canadiensensante.gc.ca/video/suspect-fra.php#trans">Transcription</a>)</p>
</figcaption>
</figure>
</div>
</section>
- Date de modification :