Adding video to a web page is as easy to do as adding audio: just add a <video>
tag to the HTML with an embedded <source>
tag specifying src
and type
, and Dartium will render this nicely (see video01.html
):
<video poster="wildlife.jpg" controls> <source src="wildlife.ogv" type='video/ogg; codecs="theora, vorbis"' /> <source src="wildlife.webm" type='video/webm; codecs="vp8, vorbis"' /> The video tag is not supported in your browser. Download the video <a href="wildlife.webm">here</a>. </video>
The poster
attribute from <video>
serves to provide the initial image, as shown in the following screenshot:
The three important formats you should care about are WEBM, MP4, and OGV. For MP4, use the following type:
type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"'
Both <audio>
and <video>
support other attributes, such as autoplay
and loop
.
For more information, consult http://www.html5rocks.com/en/tutorials/video/basics/.
Calling a video from Dart is nothing more than creating a VideoElement
class that references the <video>
tag, as in video2.dart
. The loop
property will show the video continuously:
VideoElement video = querySelector('#video'), video.loop = true;
18.188.227.4