Detailed introduction to HTML5 multimedia audio and video (2)

Earlier we learned the most basic usage of audio and video. In order to control the playback of audio and video more flexibly, we need to learn the related properties, methods and events provided by HTML5.

Audio and video related properties

##srcThe URL address used to specify the media resourceautoplayAuto play after the resource is loadedbuffered Used to return a TimeRanges object to confirm that the browser has cached the media file. controlsProvides control bars for playbackcurrentSrcReturns the URL of media data AddresscurrentTimeGet or set the current playback position in secondsdefaultPlaybackRate Return the default playback speeddurationGet the duration of the current medialoopSet or Return whether to loop playbackmutedSet or return whether to mutenetworkStateReturn to audio video Current network statuspausedCheck if the video is pausedplaybackRateSet or return audio The current playback speed of the videoplayedReturns a TimeRanges object. TimeRanges represents the audio and video range that the user has playedpreloadSet or return whether to automatically load audio and video resourcesreadyState Return the current readiness status of audio and videoseekableReturn the TimeRanges object, indicating that the current media resource can be requestedseekingReturns whether data is being requestedvalumeSet or return the volume, the value is 0 to 1.0

Properties	Description

Audio and video related methods

MethodDescriptioncanPlayType()Detect whether the browser can play the specified audio and videoload()Reload Audio and video elementspause()Stop the currently playing audio and videoplay()Start playing the current audio and video

Audio and video related events

##EventDescriptioncanplay This event occurs when the browser can start playing the specified audio and videocanplaythroughWhen the browser expects to be able to play the specified audio and video without stopping This event occurs when the specified audio and video continues to be played while bufferingdurationchangeThis event occurs when the duration data of audio and video changesloadeddataThis event occurs when the current frame data has been loaded, but there is not enough data to play the next frame of the specified audio videoloadedmatadataThis event occurs when the metadata for the specified audio video has been loaded. Metadata includes duration, dimensions (video only), and text trackloadstartThis event occurs when the browser starts looking for the specified audio videoprogressThis event occurs while downloading the specified audio videoabortWhen the audio video terminates loading , this event occursendedAfter the audio and video playback is completed, this event occurserrorThis event occurs when audio and video loading errorspauseThis event occurs when audio and video are paused playThis event occurs when playback startsplayingThis event is triggered when it is paused due to buffering or is ready after stoppingratechangeThis event occurs when the audio and video playback speed changesseekedThe user has moved or jumped This event occurs when reaching a new position in the audio videoseekingThis event occurs when the user starts to move or jump to a new audio and video playback positionstalledThis event is triggered when the browser attempts to obtain media data, but the data is not availablesuspend This event is triggered when the browser deliberately does not load media datatimeupdateThis event is triggered when the playback position changes volumechangeThis event is triggered when the volume changeswaitingThis event is triggered when the video stops due to buffering[Related recommendations]

1.

Detailed explanation of the video tag test application of html5

2.

Using video elements in html5 Make a video player

3.

Share the problem and solution of a video tag that cannot play mp4

4.

H5 video tag can only Solution to playback of sound but not video

5.

Solution to IIS MIME not registering the MP4 type, resulting in the inability to recognize the vidoe tag

The above is the detailed content of Detailed introduction to HTML5 multimedia audio and video (2). For more information, please follow other related articles on the PHP Chinese website!