Commentaire: Bien que la vidéo HTML5 puisse être utilisée pour afficher les contrôles et les pauses de lecture de contrôle, les effets d'affichage de différents navigateurs peuvent être différents. Partageons avec vous des opérations et des contrôles personnalisés à l'aide de DOM.
Bien que la vidéo HTML5 puisse utiliser des contrôles pour afficher les contrôles et les pauses de lecture de contrôle, les effets d'affichage de différents navigateurs peuvent être différents, donc nous devons utiliser DOM pour les opérations et les contrôles personnalisés. Voici un petit exemple.Bien sûr, l'effet n'est pas très beau. Si vous voulez bien paraître, vous pouvez définir votre propre style CSS, etc.
<div>
<button> Play / Pause </ Button>
<button> Big </futton>
<button> </ bouton>
<froit> Small </futton>
<video>
<source src = "Demo.mp4" type = "vidéo / mp4" />
<source src = "demo.ogg" type = "vidéo / ogg" />
Votre navigateur ne prend pas en charge cette balise vidéo HTML5.
</ vidéo>
</div>
<script type = "text / javascript">
var myvideo = document.getElementById ("myVideo");
fonction playpause ()
{
if (myvideo.paused)
myvideo.play ();
autre
myvideo.pause ();
}
fonction tobig ()
{
myvideo.width = 560;
}
fonction tonormal ()
{
myvideo.width = 420;
}
fonction tosmall ()
{
myvideo.width = 320;
}
</cript>
Il convient de noter que parmi toutes les propriétés, seules les propriétés Videowidth et Videoheight sont immédiatement disponibles.
D'autres propriétés sont disponibles après le chargement des métadonnées de la vidéo.