Play a video

video

The video element allows a browser to play and pause a media file containing a video.

Support for multiple CODECs is provided by specifying alternate versions of the video file in descendant "source" elements.

Properties

src
Use sourceref notation to identify the media file containing the video.
height
The height of the player, in pixels, but specified without units.
width
The width of the player, in pixels, but specified without units.
controls
Display a user interface to allow the video to be paused, resumed or skipped.
controlslist
A space separated list of which optional controls to disable
nodownload
nofullscreen
noremoteplayback
autoplay
Begin playing the video immediately, even before the entire file is downloaded.
loop
Play the video in a continuous loop.
muted
Mute the soundtrack of the video until the user explicitly turns it on.
playsinline
Play the video only with the player's defined position and sizing.
poster
The URL of an image to display before the media file is fully downloaded.
preload
Should the entire soundtrack be downloaded before starting?
auto Download the entire media file, even if the user may not play it.
metadata Only download the video's length.
none Do not preload.
crossorigin
Use this to fetch the media file using CORS.
anonymous Simply send a request for the image with an "Origin" header.
use-credentials Send a rquest with "Origin" header and credentials.

Examples

video `/media/15-minutes-of-fame.mp4` *controls *autoplay *height=100 *width=140
Video that starts playing immediately

video `/media/andy-warhol.webm` *controls *controlslist="nodownload nofullscreen" *height=100 *width=140
Video player with a restricted set of controls

video `/media/campbells-soup.avi` *poster='/img/tomato-soup.png' *height=100 *width=140
Video player with poster image

video *controls {
source `/media/campbells-soup.mp4` *type="video/mpeg"
source `/media/campbells-soup.webm` *type="video/webm"
source `/media/campbells-soup.avi` *type="video/avi"
}
Supporting multiple CODECs

Descendents

source
Each source element provides one version of a media file, allowing the browser to negotiate which one to use.
track
The track element references an external document containing information about the separate tracks of a video or audio file.

semantax > media-embed > videoPlay a video

🔎