Shulou(Shulou.com)06/01 Report--

In this article Xiaobian for you to introduce in detail "how to use the video element of HTML5", the content is detailed, the steps are clear, and the details are handled properly. I hope that this article "how to use the video element of HTML5" can help you solve your doubts.

HTML5 will be the new standard for HTML, XHTML and HTML DOM.

Some rules established for HTML5:

New features should be based on HTML, CSS, DOM, and JavaScript. Reduce the need for external plug-ins (such as Flash), better error handling, more replacement script markup HTML5 should be independent of the device development process and should be transparent to the public

New features

Some interesting new features in HTML5:

Canvas elements for painting video and audio elements for media playback better support for local offline storage of new special content elements, such as article, footer, header, nav, section new form controls, such as calendar, date, time, email, url, search

Video format

Currently, the video element supports three video formats:

Ogg= Ogg file with Theora video encoding and Vorbis audio coding

MPEG4= MPEG4 file with H.264 video encoding and AAC audio coding

WebM= WebM file with VP8 video encoding and Vorbis audio coding

To display video in HTML5, all you need is:

The control property allows you to add playback, pause, and volume controls.

The video element allows multiple source elements. The source element can link different video files. The browser will use the first recognized format:

Case study

Your browser does not

Support the audio tag.

Demo:

Big

Small

Your browser does not support HTML5 video.

Var myVideo=document.getElementById ("video1")

Function playPause ()

{

If (myVideo.paused)

MyVideo.play ()

Else

MyVideo.pause ()

}

Function makeBig ()

{

MyVideo.width=560

}

Function makeSmall ()

{

MyVideo.width=320

}

Function makeNormal ()

{

MyVideo.width=420

}

HTML5 specifies a standard way to include audio through the audio element.

The audio element can play a sound file or an audio stream.

Audio format

Currently, the audio element supports three audio formats:

How to work

To play audio in HTML5, all you need is:

The control property allows you to add playback, pause, and volume controls.

The audio element allows multiple source elements. The source element can link different audio files. The browser will use the first recognized format:

Case study

Your browser does not

Support the audio tag.

Attributes of the tag

Drag and drop (Drag and drop) is part of the HTML5 standard.

Drag and drop

Drag and drop is a common feature that grabs an object and then drags it to another location.

In HTML5, drag and drop is part of the standard, and any element can be dragged and dropped.

Drag and drop an instance:

Function allowDrop (ev) {

Ev.preventDefault ()

}

Function drag (ev) {

Ev.dataTransfer.setData ("Text", ev.target.id)

}

Function drop (ev) {

Ev.preventDefault ()

Var data=ev.dataTransfer.getData ("Text")

Ev.target.appendChild (document.getElementById (data))

}

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.