Attribute usage in the video (video) and audio (audio) tags of html5

This article introduces you to the usage of attributes in the HTML5 video (video) and audio (audio) tags. It has certain reference value. Friends in need can refer to it. I hope it will be helpful to you. .

How to enable

##To enable HTML5 video and audio tags to work in all major browsers browser, just add the following line of code somewhere in the of your document.

<script src="//api.html5media.info/1.2.2/html5media.min.js"></script>

How to embed a video

You can use the following The code embeds the video into your page.

<video src="video.mp4" width="320" height="200" controls preload></video>

How to embed audio

You can use the following The code embeds the audio into the page.

<audio src="audio.mp3" controls preload></audio>

Video format:

Format MIME-type
MP4 video/mp4
WebM video/webm
Ogg video/ogg

New attributes in HTML5: Attribute value description
autoplay autoplay If this attribute appears, the video will be played as soon as it is ready.
controls controls If this attribute appears, controls are displayed to the user, such as a play button.
height pixels Set the height of the video player.
loop loop If this attribute appears, playback will start again after the media file completes playback.
muted muted specifies that the audio output of the video should be muted.
poster URL specifies the image displayed when the video is downloaded, or the image displayed before the user clicks the play button (
poster = " poster.jpg ”). preload preload If this attribute appears, the video will be loaded when the page is loaded and prepared for playback (preloading).
If "autoplay" is used, this attribute is ignored.
src url URL of the video to be played.
width pixels Set the width of the video player.

HTML Audio/Video Method: Method Description
addTextTrack() Adds a new text track to audio/video.
canPlayType() detects whether the browser can play the specified audio/video type.
load() Reload audio/video elements.
play() Start playing audio/video.
pause() Pauses the currently playing audio/video.

You can use addEventListener to monitor the ended event of the video, monitor the end time, perform end and jump operations, etc.

Recommended related articles:

HTML5 option attribute: How to use the option attribute to implement a cascading drop-down list

Summary of changes in html5 page structure and adding and deleting tags

The above is the detailed content of Attribute usage in the video (video) and audio (audio) tags of html5. For more information, please follow other related articles on the PHP Chinese website!