How can I make videos load after clicking play not before?
and
what is the best way, using HTML5 video tag or make a flash player?
use preload attribute in HTML video element. Enable the option after play is clicked using jquery.
You can pause a video using the pause() method:
$("#videoID").get(0).pause();
You can then resume the playback of the video using the play() method:
$("#videoID").get(0).play();
Related
I am needing to download a video that is sourced from an HTML5 element. The issue is that I want the download button to be more visible.
<video controls disablepictureinpicture>
<source src="https://www.learningcontainer.com/wp-content/uploads/2020/05/sample-mp4-file.mp4">
</video>
<a href="https://www.learningcontainer.com/wp-content/uploads/2020/05/sample-mp4-file.mp4" download>
Download Video (not functional)
</a>
This code provides two download buttons.
One hidden in the button menu of the HTML5 Video Player.
Another attempted in the <a>tag.
The <a> tag navigates instead of downloads because of CORS.
Problem:
Is it possible for me to modify the <video> tag to make the download button immediately visible without having to download via the player's menu button?
Or for some javascript to click the download button from the media player?
I think you should create your custom video player UI, instead of modifying the video tag UI which is impossible as far as I know.
maybe you can try this third-part lib video.js
live demo
https://codepen.io/xgqfrms/pen/jOYKWPe
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.)
I have UIWebview contain video in the html ,I need to detect the first video in the html and play it.
Is there any trick in javascript or objective c to Autoplay the video when page finish loading ?
If the embedded video is not from Youtube, you must set your UIWebView to allow media playback without user action.
This can be done by setting the mediaPlaybackRequiresUserAction property of your UIWebView to false.
Example: self.webView.mediaPlaybackRequiresUserAction = NO;
If you've embedded a YouTube video, you can simply append &autoplay=1 to the end of the video url.
This will cause the video to autoplay on page load.
Click on inline Playback in storyboard
<iframe width="500" height="500" src="https://www.youtube.com/embed/OWsyrnOBsJs"></iframe>
<button>Skip Video</button>
I have set up iframe to embed the youtube video. When the video is over it gives me new recommended videos I can click and play. I was wondering how can I set up my button(skip video) to skip the video and auto play the next recommend video or perhaps the next video in the playlist?
Maybe HTML5 won't be enough so I might have to use JavaScript or Dart. What is the easiest way to go about doing this?
I advise you to use the YouTube JavaScript Player API.
There are many helpful methods to play the next video etc. It is very nice documentated.
Documentation Youtube API
What is the best way to create a video player similar to the youtube video player in that after the video has played, it shows a collection of further videos to watch?
The videos are not hosted on youtube.
Generating the video suggestions is not a problem. The problem is displaying them in the player after the video finished playing in such a way that if the user clicks one of the suggestions, the selected video page is opened and played.
Can I do this in html5 or jquery or flash or something else?
JWPlayer is a good HTML5 video player with a Flash fallback. It also has a decent API which supports related videos: http://www.longtailvideo.com/support/addons/related-videos/22352/related-videos-reference-guide/.
There are a few license options too: http://www.longtailvideo.com/jw-player/pricing/
Hope that helps.
Can be done in Flash. You could use the FLVPlayback Component to play the original video. Then use the Listener Class to listen for COMPLETE. You could then place thumbnails for each of the related videos on top of the FLVPlayback Component - these would then load the new video into the component and the process would continue.
Check this tutorial out for using the component and also the Listener Class for the component.