How To Add Video On the Website, In this blog we will see how we can add video on the website. HTML5 has a native video element that supports three video formats (MP4, WebM, and Ogg), making it much easier to embed videos on a webpage. You can define the external source for the video using a file or a URL.
Import video on your server or website root directory where website runing
In HTML5, you can embed a video in your webpage using a pair of <video> tags. It is also mandatory to define the source for the video. You can do it by using a simple src attribute, but it is recommended to choose the <source> tags for that:
The video tag is used to embed video content in a html pages, videos such as a movie clip or other video streams.
<video id="video2" controls autoplay width="800" height="500" muted> <source src="video4" type="video/mp4"> Video tag is not supported in this browser. </video>
The poster attribute is the image that shows on the video until the user clicks to play it.
<video poster="poster.png"> <source src="video.mp4" type="video/mp4"> <source type="video/ogg" src="video_file.ogg"></source> </video>
Play click event :
$("#click-header2").on('click',function(){ document.getElementById('video2').play(); });
Pause click event :
$("#click-header2").on('click',function(){ document.getElementById('video2').pause(); });
Another code
<video id="video2" class="img-fluid" autoplay="" muted="" playsinline="" loop="" src="http://example.com/video2.mp4"> <source src="images/banner-video2.mp4" type="video/mp4"> <source src="images/banner-video2.ogv" type="video/ogv"> </video>
Browser support:
Chrome 3+
Edge All
Firefox 3.5+
IE 9+
Opera 10.5+
Safari 3.1+
So, above you saw how to add video on website. Hope you like it.
Related Blog – Database connection in PHP