Menu
I have an HTML5 video with a poster attribute. I would like to somehow set it up so that you can click on anywhere on the video element (the area of the poster image) and it will fire the play event and start the video? I feel like this is fairly standard practice, but I can not find a way to do this without flash. Any help would be much appreciated.
907
The poster attribute specifies an image to be shown while the video is downloading, or until the user hits the play button. If this is not included, the first frame of the video will be used instead.
The HTML5 video will be viewable in all modern day browsers, such as Internet Explorer, Google Chrome, Safari and Firefox. If you are downloading these browsers for the first time then just make sure you have all the latest updates downloaded for them as well. They usually prompt you automatically about the updates.
With the introduction of HTML5, you can now place videos directly into the page itself. This makes it possible to have videos play on pages that are designed for mobile devices, as plugins like Adobe Flash Player don't work on Android or iOS.
The HTML <video> poster Attribute is used to display the image while video downloading or when user click the play button.
This is working for me Andrew.
In your html head add this small piece of js:
var video = document.getElementById('video'); video.addEventListener('click',function(){ video.play(); },false); Or, just add an onlick attribute directly to your html element:
<video src="your_video" width="250" height="50" poster="your_image" onclick="this.play();"/> If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
