.jpg)
|
|
This tutorial will add some options. Such as:
The HTML DOM defines methods, properties, and events for the element. This allows you to load, play, and pause videos, as well as setting duration and volume. There are also DOM events that can notify you when a video begins to play, is paused, etc. |
Example of HTML Video - Methods, Properties, and Events using Javascript
Example: Using JavaScript
index.html
Example:
HTML
<!DOCTYPE html>
<html>
<body>
<div style="text-align:center">
<button onclick="playPause()">Play/Pause</button>
<button onclick="makeBig()">Big</button>
<button onclick="makeSmall()">Small</button>
<button onclick="makeNormal()">Normal</button>
<br><br>
<video id="video1" width="420">
<source src="https://www.w3schools.com/html/mov_bbb.mp4" type="video/mp4">
<source src="https://www.w3schools.com/html/mov_bbb.mp4" type="video/ogg">
Your browser does not support HTML video.
</video>
</div>
<script>
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;
}
</script>
<p>Video courtesy of <a href="https://www.bigbuckbunny.org/" target="_blank">Big Buck Bunny</a>.</p>
</body>
</html>
Output should be:
Reffered: https://www.w3schools.com/html/html5_video.asp
| Example of HTML Video - Methods, Properties, and Events using Javascript | HTML Input Attributes |
Read Full: | HTML Input Attributes |
Category: | Web Tutorial |
Sub Category: | HTML Input Attributes |
Uploaded: | 10 months ago |
Uploaded by: | Admin |
Views: | 23 |