There are a lot pages like Youtube starting their videos with sound on load:
https://www.arte.tv/de/videos/091148-000-A/forschung-fake-und-faule-tricks/
Sound should be only allowed after click, whitelisting or if multiple videos on the page have been viewed before. This is not needed here.
What is the difference between these pages and a simple HTML5 Video element using autoplay attribute or Javascript videoElement.play()?
In case you are using Chrome there is another thing which influences if a page can autoplay media or not. It's the Media Engagement Index. It's basically a number which is larger if you used to play media on that particular page before. If it's large enough the page is allowed to autoplay.
Related
I want to embed a youtube video on my own website and I want this youtube video not to be skipped in any way, but not to adjust its speed and to track the time it watches, but I could not find any source.
I tried to use the youtube iframe api, but I can't follow the stats without stopping or starting the youtube video there.
I would suggest that you should first download the video, and then put it onto your site through a <video> tag. The youtube iframe api is designed only for having videos that function exactly like they do on the youtube website, which includes the things you don't want.
I am currently working on a google chrome extension that features a content script for altering youtube pages. I have done some work with altering the DOM already and all of that works, however, I have been looking for solutions to have the youtube video pause when the page loads.
I initially thought perhaps I could simulate a keystroke as the spacebar pauses youtube videos. I also tried using javascript to pause the video but I don't think it works with Youtube's custom video player.
Don't feel obligated to write any code for this but if someone could point me in the right direction I would be very grateful.
On the main page of a video, the HTML5 video element playing the video has a specific class, so you can target that; and as an HTML5 video element, it has the play() and pause() methods already.
document.querySelectorAll('.html5-main-video').forEach(vid => vid.pause());
That will pause all HTML5 main videos on the page. Helpfully enough, that's the same class used by the little autoplaying video on some channel pages, so it should work for those as well :)
(Don't worry about Flash videos; YouTube hasn't supported those for years now.)
Based on this page on w3schools I don't see any mention of Javascript being needed to play HTML5 videos on recent browsers.
https://www.w3schools.com/html/html5_video.asp
Yet, when I disable Javascript on Safari, I can no longer play Videos embedded on my webpage via Tag. I even disabled lazy loading on a test page to see if that helped, but it didn't.
My primary concern is visitors on Mobile devices so falling back to flash is not an option.
hence the question, Is Javascript needed on fairly recent browsers ? what are best fallback options without requiring any plugins ?
like, using to provide direct download of Video, etc ?
javascript is absolutely not required to play the video in html5
the w3 video is not playing because it is rendering that part of the dom using js and also video is not local it is brought by anchor tag
i'm developing an html page using jQueryfullPage.js, inside this page i integrated like 17 videos in 17 different sections, these are youtube iframes with data-autoplay attribute. Everything is working fine, the videos are only playing when we are on(viewport) the section containing the video, except that there are specific sections that the videos are auto playing on page load even when we aren't on the section containing this video. there are 3/17 videos that are playing automatically, but the rest of them are working properly. Any help? Thanks in Advance.
From the fullPage.js docs:
Using the attribute autoplay for videos or audio, or the param autoplay=1 for youtube iframes will result in the media element playing on page load. In order to play it on section/slide load use instead the attribute data-autoplay.
Make sure they don't contain autoplay=1 in the video URL.
I work on a website that embeds videos from many different websites, the number of sources run into the thousands. For YouTube, their JavaScript API allows a way to detect when the video ends and one can execute any function he wants at that time. But this will only work for the youtube videos. What about all the others?
So is there a global all applicable way to detect when the Flash video on a page has stopped playing using either javascript or action script? And by "stopped playing" I mean stopped playing when it reached the end and not just been paused half way.
P.S. There will always be one embedded video inside a <div> with the id video on the page.
Just like YouTube provides an API, those players from those external websites have to provide their own APIs as well. There isn't an easy one-size-fits-all solution that you can implement in JavaScript.