What is HTML5 Video/Dom

In this article I have described the Video/Dom in HTML5
  • 2306

INTRODUCTION

HTML5 is a standard for structuring and presenting content on the World Wide Web. The <video> element also has methods, properties, and events. There are methods for playing, pausing, and loading. The new standard incorporates features like video playback and drag-and-drop. There are also DOM events that can notify you, for example, when the <video> element begins to play, is paused, is ended, etc.

Custom Control of Video/Dom in HTML5

These methods are play and pause video playback. If we're controlling the video from JavaScript, the play() and pause() methods actually return successfully. Some control are here.

Method Description
PLAY() Will always start the video from the current playback position.
PAUSE() Programmatically change the current playback position yourself.
STOP() If you want to stop playback and "rewind" to the start of the movie.

Example of Video/Dom in HTML5

<!DOCTYPE html>
<html>
<head>
<style>
video
 {
          width: 600px;
          height: 500px;
          border: 2px solid black;
}
.video-container 
{
            display: inline-block;
            text-align: center;
}
p
{
            font: 20px Arial;
}
</style>
</head>
<body>
<div class="video-container">
<p>.webm</p>
<video poster="http://www.html5rocks.com/en/tutorials/video/basics/star.png" controls>
<source src="http://www.html5rocks.com/en/tutorials/video/basics/Chrome_ImF.webm" type='video/webm; codecs="vp8, vorbis"' />
</video>
</div>
</body>
</html>

OUTPUT

videodom.gif
 
Further Readings

You may also want to read these related articles :

Ask Your Question 

Got a programming related question? You may want to post your question here

Programming Answers here

© 2020 DotNetHeaven. All rights reserved.