Audio and Video Tags of HTML5

Video Tag

This Tag specifies video, such as a movie clip or the other video streams. Currently, there are 3 supported video formats for the <video> element: MP4, WebM, and Ogg.

<video id="myvedio" width="320" height="240" controls="controls" >
<source src="abc.mp4" type="video/mp4" />
<!-If browser doesn't support this Tag then show this Line->Your browser does not support the video tag.
</video>

To change the size and Play/Pause the video, you have to create some buttons in HTML and write some JavaScript / JQuery codes for the activities such as:

// JQuery code in Head Tag after adding JQuery Library on the page
<script>
$(function () {
var myVideo = document.getElementById("myvedio");
$('#btn_play').click(function () {
if (myvedio.paused)
myvedio.play();
else
myvedio.pause();
});
$('#btn_small').click(function () {
myVideo.width = 320;
});
$('#btn_Big').click(function () {
myVideo.width = 560;
});
$('#btn_normal').click(function () {
myVideo.width = 420;
});
});
</script>undefined</head>

<input id="btn_play" type="button" value="Play/Pause" />
<input id="btn_Big" type="button" value="Big" />
<input id="btn_small" type="button" value="Small" />
<input id="btn_normal" type="button" value="Normal" />

Note:- The <video> tag is supported in Internet Explorer 9+, Firefox, Opera, Chrome, and Safari.

Audio Tag

This tag defines sound, such as music or other audio streams. Currently, there are 3 supported file formats for the <audio> element: MP3, Wav, and Ogg

<audio id="myaudio" width="320" height="240" controls>
<source src="my.mp3" type="audio/mpeg" />
<!-If browser doesn't support this Tag then show this Line->Your browser does not support the audio tag.
</audio>

Note - The <audio> tag is supported in Internet Explorer 9+, Firefox, Opera, Chrome, and Safari.