It is possible to play a local video file. <input type=”file” accept=”video/*”/> <video controls autoplay></video> When a file is selected via the input element: ‘change’ event is fired Get the first File object from the input.files FileList Make an object URL that points to the File object Set the object URL to the video.src property … Read more
It seems to me like you could just check for !stream.paused.
Edit 2014/10: by popular demand I’m maintaining and moving this to GitHub. Please check cprcrack/VideoEnabledWebView for the last version. Will keep this answer only for reference. Edit 2014/01: improved example usage to include the nonVideoLayout, videoLayout, and videoLoading views, for those users requesting more example code for better understading. Edit 2013/12: some bug fixes related … Read more
Depending on what browsers you’re targeting, you could go for the object-fit property to solve this: object-fit: cover; or maybe fill is what you’re looking for. Still under consideration for IE.
There is not a specific attribute that will reveal whether a MediaElement is currently playing. However, you can deduce this from the state of the other attributes. If: currentTime is greater than zero, and paused is false, and ended is false then the element is currently playing. You may also need to check readyState to … Read more
The loop attribute should do it: <video width=”320″ height=”240″ autoplay loop muted> <source src=”movie.mp4″ type=”video/mp4″ /> <source src=”movie.ogg” type=”video/ogg” /> Your browser does not support the video tag. </video> The addition of the unintuitive muted attribute is required by Chrome as documented on their dev site. Should you have a problem with the loop attribute … Read more
You have to wait until the browser knows the duration of the video before you can seek to a particular time. So, I think you want to wait for the ‘loadedmetadata’ event something like this: document.getElementById(‘vid1’).addEventListener(‘loadedmetadata’, function() { this.currentTime = 50; }, false);
It should be noted that the currently accepted solution above by Sime Vidas doesn’t actually work in modern browsers since the videoWidth and videoHeight properties aren’t set until after the “loadedmetadata” event has fired. If you happen to query for those properties far enough after the VIDEO element is rendered it may sometimes work, but … Read more
I had same issue with apple devices like iPhone and iPad, I turned off the low power mode and it worked and you should also include playsinline attribute in video tag like this: <video class=”video-background” autoplay loop muted playsinline> It only worked when including playsinline.
2020 answer HTML 5 provides no way to make a video fullscreen, but the parallel Fullscreen API defines an API for elements to display themselves fullscreen. This can be applied to any element, including videos. Browser support is good, but Internet Explorer and Safari need prefixed versions. An external demo is provided as Stack Snippet … Read more