Explication détaillée du contrôle du nouvel attribut audio audio et vidéo vidéo (recommandation)

Cet article indique le contrôle de H5 New Attribut Audio Audio and Video Video.

 <Udio Controls = Controls> <Source Src = Mettez le chemin du fichier audio dedans> </ Source> </ Audio>

 <Video Controls = Controls Loop = Loop AutoPlay = AutoPlay ID = VIDEO> <Source Src = Mettez le chemin du fichier vidéo dedans> </ Source> </ Video> <Fut-Button> </ Button> On> Ouvrez le son < / Button> <Fut-Button> Play </ Button> <Fut-Button> Arrêtez de lire </ftones> <Fut-Button> Full Screen </fruts>

Voici le contrôle des fichiers vidéo;

JavaScript leads.

 <fraction> var myvideo = document.getElementyId (vidéo); 1] .click = function () {myvideo.muted = true; (si elle est silencieuse: non)} btn [2] .click = function () {myvideo.play (); );

Synchrone.

Comme indiqué sur la figure:

Laissez-moi en parler ici, tout d'abord

(1), la valeur maximale de la longueur totale de la vidéo à la vidéo à la barre de progression, le progress.max = vidéo.Duration;

(2), besoin d'obtenir la longueur de la position actuelle de la lecture vidéo actuelle sur la longueur de la barre de progression actuelle, Progress.Value = video.currentTime;

Ensuite, bien que la lecture vidéo, il est nécessaire de s'assurer que la valeur de la barre de progression peut obtenir la durée de la vidéo et la position de temps de lecture actuelle à temps.

Vous devez ouvrir une minuterie setInterval (Pro, 100); :: Cela signifie que la valeur de la vidéo est attribuée à la barre de progression de Progress à 1 milliseconde, afin d'assurer la sûre.

De cette façon, la barre de progrès peut être synchronisée avec précision avec la vidéo.

1. Tout d'abord, vous devez obtenir la valeur de valeur de la plage et le volume donné à la vidéo pour contrôler le volume de la vidéo.

 <Type d'entrée = plage min = 0 valeur = 50 max = 100 id = plage /> var ran = document.getElementById (plage);

Obtenir la gamme.Value,

Attributs audio affectés à la vidéo: vidéo.volume = range.value / 100;

À l'heure actuelle, le volume de la gamme simplement glisser et de contrôler la vidéo.

Ensuite, vous devez aller dans le son pour fermer le jugement.

Le code final est le suivant;

 <! > Fermer le son </ftones> <bouton onClick = DisableMute () Type = Button> Ouvrez le son </futton> <Button OnClick = PlayVid () Type = Button> Play Video </ftont> <Button OnClick = Pauvid () Type = Button> Passer la vidéo </ bouton> <Button OnClick = showfull () type = Button> plein écran </ bouton> <span> Progress: </span> <Progress Value = 0 Max = 0 id = pro> </ progress > <span> Volume: </span> <Type d'entrée = range min = 0 max = 100 valeur = 50 onChange = setValue () id = ran /> </div> <script> var btn = document.getElementsByTagName (bouton) ; .disabled = true; } // Play la fonction vidéo playvid () {myvideo.play (); Montant funch setValue () {) {) myvideo.volume = ran.value / 100;

Ce qui précède est tout le contenu de cet article.