Table des matières
Attributs liés à l'audio et à la vidéo
Méthodes liées à l'audio et à la vidéo
Événements liés à l'audio et à la vidéo
Maison interface Web Tutoriel H5 Introduction détaillée à l'audio et à la vidéo multimédia HTML5 (2)

Introduction détaillée à l'audio et à la vidéo multimédia HTML5 (2)

May 19, 2017 pm 04:55 PM

Plus tôt, nous avons appris l'utilisation la plus élémentaire de l'audio et de la vidéo. Afin de contrôler la lecture de l'audio et de la vidéo de manière plus flexible, nous devons apprendre les attributs, méthodes et événements associés fournis par HTML5.

Attributs liés à l'audio et à la vidéo

属性 描述
src 用于指定媒体资源的URL地址
autoplay 资源加载后自动播放
buffered 用于返回一个TimeRanges对象,确认浏览器已经缓存媒体文件。
controls 提供用于播放的控制条
currentSrc 返回媒体数据的URL地址
currentTime 获取或设置当前的播放位置,单位为秒
defaultPlaybackRate 返回默认播放速度
duration 获取当前媒体的持续时间
loop 设置或返回是否循环播放
muted 设置或返回是否静音
networkState 返回音频视频当前网络状态
paused 检查视频是否已暂停
playbackRate 设置或返回音频视频的当前播放速度
played 返回TimeRanges对象。TimeRanges表示用户已经播放的音频视频范围
preload 设置或返回是否自动加载音视频资源
readyState 返回音频视频当前就绪状态
seekable 返回TimeRanges对象,表明可以对当前媒体资源进行请求
seeking 返回是否正在请求数据
valume 设置或返回音量,值为0到1.0

Méthodes liées à l'audio et à la vidéo

方法 描述
canPlayType() 检测浏览器是否能播放指定的音频、视频
load() 重新加载音频、视频元素
pause() 停止当前播放的音频、视频
play() 开始播放当前音频、视频

Événements liés à l'audio et à la vidéo

事件 描述
canplay 当浏览器能够开始播放指定的音视频时,发生此事件
canplaythrough 当浏览器预计能够在不停下来进行缓冲的情况下持续播放指定的音频视频时,发生此事件
durationchange 当音频、视频的时长数据发生变化时,发生此事件
loadeddata 当当前帧数据已加载,但没有足够的数据来播放指定音频视频的下一帧时,会发生此事件
loadedmatadata 当指定的音频视频的元数据已加载时,会发生此事件。元数据包括时长、尺寸(仅视频)以及文本轨道
loadstart 当浏览器开始寻找指定的音频视频时,发生此事件
progress 正在下载指定的音频视频时,发生此事件
abort 音频视频终止加载时,发生此事件
ended 音频视频播放完成后,发生此事件
error 音频、视频加载错误时,发生此事件
pause 音频视频暂停时,发生此事件
play 开始播放时,发生此事件
playing 因缓冲而暂停或停止后已就绪时触发此事件
ratechange 音频视频播放速度发生改变时,发生此事件
seeked 用户已移动、跳跃到音频视频中的新位置时,发生此事件
seeking 用户开始移动、跳跃到新的音频视频播放位置时,发生此事件
stalled 浏览器尝试获取媒体数据,但数据不可用时触发此事件
suspend 浏览器刻意不加载媒体数据时触发此事件
timeupdate 播放位置发生改变时触发此事件
volumechange 音量发生改变时触发此事件
waiting 视频由于需要缓冲而停止时触发此事件

[Recommandations associées]

1 Explication détaillée de l'application de test de balise vidéo HTML5

2. . Utilisez l'élément vidéo pour créer un lecteur vidéo en HTML 5

3 Partagez le problème et la solution d'une balise vidéo qui ne peut pas lire le mp4

<.>4 .

La solution au problème selon lequel la balise vidéo H5 ne peut lire que le son mais pas la vidéo

5.

Le MIME d'IIS n'enregistre pas le type MP4, ce qui entraîne dans la solution à l'impossibilité de reconnaître le tag vidoe

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn

Outils d'IA chauds

Undresser.AI Undress

Undresser.AI Undress

Application basée sur l'IA pour créer des photos de nu réalistes

AI Clothes Remover

AI Clothes Remover

Outil d'IA en ligne pour supprimer les vêtements des photos.

Undress AI Tool

Undress AI Tool

Images de déshabillage gratuites

Clothoff.io

Clothoff.io

Dissolvant de vêtements AI

AI Hentai Generator

AI Hentai Generator

Générez AI Hentai gratuitement.

Article chaud

R.E.P.O. Crystals d'énergie expliqués et ce qu'ils font (cristal jaune)
1 Il y a quelques mois By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Meilleurs paramètres graphiques
1 Il y a quelques mois By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Comment réparer l'audio si vous n'entendez personne
1 Il y a quelques mois By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Commandes de chat et comment les utiliser
1 Il y a quelques mois By 尊渡假赌尊渡假赌尊渡假赌

Outils chauds

Bloc-notes++7.3.1

Bloc-notes++7.3.1

Éditeur de code facile à utiliser et gratuit

SublimeText3 version chinoise

SublimeText3 version chinoise

Version chinoise, très simple à utiliser

Envoyer Studio 13.0.1

Envoyer Studio 13.0.1

Puissant environnement de développement intégré PHP

Dreamweaver CS6

Dreamweaver CS6

Outils de développement Web visuel

SublimeText3 version Mac

SublimeText3 version Mac

Logiciel d'édition de code au niveau de Dieu (SublimeText3)

Bordure de tableau en HTML Bordure de tableau en HTML Sep 04, 2024 pm 04:49 PM

Guide de la bordure de tableau en HTML. Nous discutons ici de plusieurs façons de définir une bordure de tableau avec des exemples de bordure de tableau en HTML.

Marge gauche HTML Marge gauche HTML Sep 04, 2024 pm 04:48 PM

Guide de la marge HTML gauche. Nous discutons ici d'un bref aperçu de la marge gauche HTML et de ses exemples ainsi que de son implémentation de code.

Tableau imbriqué en HTML Tableau imbriqué en HTML Sep 04, 2024 pm 04:49 PM

Ceci est un guide des tableaux imbriqués en HTML. Nous discutons ici de la façon de créer un tableau dans le tableau ainsi que des exemples respectifs.

Disposition du tableau HTML Disposition du tableau HTML Sep 04, 2024 pm 04:54 PM

Guide de mise en page des tableaux HTML. Nous discutons ici des valeurs de la mise en page des tableaux HTML ainsi que des exemples et des résultats en détail.

Klipsch dévoile la barre de son phare Flexus Core 300 avec prise en charge 8K, 12 haut-parleurs et correction de pièce Klipsch dévoile la barre de son phare Flexus Core 300 avec prise en charge 8K, 12 haut-parleurs et correction de pièce Sep 05, 2024 am 10:16 AM

Le Klipsch Flexus Core 300 est le modèle haut de gamme de la série et se positionne au-dessus du Flexus Core 200 déjà disponible dans la gamme de barres de son de l'entreprise. Selon Klipsch, il s'agit de la première barre de son au monde dont le son peut être adapté aux besoins.

Espace réservé d'entrée HTML Espace réservé d'entrée HTML Sep 04, 2024 pm 04:54 PM

Guide de l'espace réservé de saisie HTML. Nous discutons ici des exemples d'espace réservé d'entrée HTML ainsi que des codes et des sorties.

Liste ordonnée HTML Liste ordonnée HTML Sep 04, 2024 pm 04:43 PM

Guide de la liste ordonnée HTML. Ici, nous discutons également de l'introduction de la liste et des types HTML ordonnés ainsi que de leur exemple respectivement.

Déplacer du texte en HTML Déplacer du texte en HTML Sep 04, 2024 pm 04:45 PM

Guide pour déplacer du texte en HTML. Nous discutons ici d'une introduction, du fonctionnement des balises de sélection avec la syntaxe et des exemples à implémenter.

See all articles