In this article I will explain with an example, how to use HTML5 Video player in HTML.
Video File Location
The Video File is stored in a folder within the Website project.
HTML Markup
The following HTML Markup consists of an HTML5 Video Player element.
The HTML5 Video Player element has the following properties:
1. id – ID of the Video Player.
2. src – URL of the Video.
3. width – Width of the Video Player.
4. height – Height of the Video Player.
5. controls – If set True, it display the control Buttons such as Play Pause, Volume, etc. in the HTML5 Video Player.
6. loop – If set True, it will keep playing video i.e. once the video is completed, automatically it will start again.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
</head>
<body>
<video id="VideoPlayer" src="Files/Butterfly.mp4" controls="true"
width="400" height="350" loop="true" />
</body>
</html>
Screenshot
Browser Compatibility
The above code has been tested in the following browsers only in versions that support HTML5.
* All browser logos displayed above are property of their respective owners.
Demo
Downloads