Presentation is loading. Please wait.

Presentation is loading. Please wait.

HTML 5 Tutorial Chapter 3 Video. Video HTML 5.0 provides a standard for showing video. Using the element we can easily embed video within our web page.

Similar presentations


Presentation on theme: "HTML 5 Tutorial Chapter 3 Video. Video HTML 5.0 provides a standard for showing video. Using the element we can easily embed video within our web page."— Presentation transcript:

1 HTML 5 Tutorial Chapter 3 Video

2 Video HTML 5.0 provides a standard for showing video. Using the element we can easily embed video within our web page. The video formats the element supports include the following : MPG4 (with H.264 video codec and AAC audio codec) OGG (with Thedora video codec and Vorbis audio codec)

3 Format Until now, there has never been a standard for showing video on a web page. Today, most videos are shown through a plugin (like flash). However, not all browsers have the same plugins. HTML5 specifies a standard way to include video, with the video element. Currently, there are 2 supported video formats for the video element: FormatFirefox 3.5Opera 10.5Chrome 3.0IE 8Safari 3.0 OggYes No MPEG 4No YesNoYes

4 Basic Syntax Basic Syntax to Embed Video : *Content we place in between the tags will be displayed when the browser doesn't support displaying video We can use the width and height attributes in order to specify the size The control attribute is for adding the play, pause and volume controls

5 Basic Syntax Example : HTML 5 Playing Video Sample <video src="http://example.com/video/example_video.ogg" controls="controls" width=“600" height=“280"> Browser does not support HTML 5.0

6 Basic Syntax The video element allows multiple source elements. Source elements can link to different video files. The browser will use the first recognized format : Your browser does not support the video tag.

7 Attribute The HTML 5.0 supports the following attributes : AttributeValueDescription audiomuted Defining the default state of the the audio. Currently, only "muted" is allowed autoplay If present, then the video will start playing as soon as it is ready controls If present, controls will be displayed, such as a play button heightpixels Sets the height of the video player loop If present, the video will start over again, every time it is finished posterurl Specifies the URL of an image representing the video preload If present, the video will be loaded at page load, and ready to run. Ignored if "autoplay" is present srcurl The URL of the video to play widthpixels Sets the width of the video player

8 Reference 1.Hickson, I. (Eds.). (2011). HTML Living Standar. Retrieved from http://www.whatwg.org/specs/web- apps/current-work/multipage/ 2.World Wide Web Consortium. (n.d.). HTML 5 Tutorial. Retrieved from http://www.w3schools.com/html5/default.asp


Download ppt "HTML 5 Tutorial Chapter 3 Video. Video HTML 5.0 provides a standard for showing video. Using the element we can easily embed video within our web page."

Similar presentations


Ads by Google