HTML and CSS Reference
Video with Controls, Loop, and Autoplay
way to control a video. Also, as the developer, you might want a video to play automatically
are very easy to accomplish in HTML5.
Adding controls, looping, and autoplay to an HTML5 video embed is simple. All you need to
do is specify the options controls , loop , and/or autoplay in the <video> tag, like this:
<video autoplay loop controls id= "thevideo" width= "320" height= "240" >
<source src= "muirbeach.webm" type= 'video/webm; codecs="vp8, vorbis"' >
<source src= "muirbeach.mp4" type= 'video/mp4; codecs="avc1.42E01E, mp4a.40.2"' >
<source src= "muirbeach.ogg" type= 'video/ogg; codecs="theora, vorbis"' >
As of this writing, loop does not work in Firefox; however, support is expected in version 4.0.
The code to embed our Muir Beach video with controls , loop , and autoplay is in
CH6EX2.html inthecodedistribution. Figure 6-2 showswhatavideowithcontrolslookslike
in Google Chrome.