how can start a video after click a generic button.
I just initialized the flowplayer in my page.
Related
MAKE A BUTTON THAT PLAYS A VIDEO AND THE VIDEO HAS 4 BUTTON BELOW IT
I tried searching it up here but all I found was how to make a button that plays a Youtube video. I wanted it in fullscreen and also buttons that play another video.
To add a video with controls, you can use the HTML5 video tag to add a video, and add the controls attribute to enable the controls.
I have Microsoft stream video iframe embed on html page pop-up modal. The video is displayed on Modal pop-up when a button is clicked and plays with default controls. When i close the modal pop, the video still runs on the background. I need to stop/pause the video when the modal pop-up is closed. I have tried with JavaScript video pause scripts but nothing works out. Streams runs with Azure player, Any suggestion to control the video with JavaScript
My website has a video banner at the top of the home page similar to AirBnb's. It has a play glyphicon on it. When I press the glyphicon, I want a video from YouTube to open in fullscreen mode and play automatically. Then, when the user quits the fullscreen video, I want the Iframe to vanish and all audio to stop.
Right now I have this for Slim markup
.fullScreenContainer
.video-container#autovid height="100%"
= video_tag("broll2.mp4", autoplay: true, muted: true, preload:true, loop:true)
.container#playButton
.text-center
h1#videoHeading Press Play to Watch the Video
a href="javascript:void(0);" onclick="addIntroVideo()"
span.glyphicon.glyphicon-play
and this is my jQuery function
function addIntroVideo() {
$('<iframe id="introVideo" src="https://www.youtube.com/embed/6a8fvbkNLWQ?rel=0&autoplay=1" frameborder="0" allowfullscreen="true"></iframe>').appendTo('.fullScreenContainer');
}
My understanding is that appending ?rel=0&autoplay=1 to the YouTube URL makes the video play in full screen mode and start automatically. However, when I press play it just loads a tiny iframe and autoplays that. How do I change this code to get it to do what I want?
Don't make the iframe yourself. Instead, use the YouTube iframe API example
You can add embedded JavaScript under this Slim tag:
javascript:
That JavaScript creates the iframe and an object called player that has methods stopVideo() and startVideo(), and you can use more JavaScript to hook those functions to a button click handler.
I have developed a video playlist for a Drupal site. My question is: Is it possible to show the spinner instead of the big play button on every video ending(through Javascript), until the page containing the next video of each list is loaded? The videojs version that's used is 2.0.2.
Galleria has a bunch of useful API functions (http://galleria.io/docs/api/events) but none of them appear to allow you to detect when a Youtube video player iFrame has successfully loaded.
The previous version of Galleria did not support video posters and so any YT videos in the gallery were automatically embedded into a slide when it was shown. Using the 'image' event (http://galleria.io/docs/api/events/#image) I could then detect if it was a video and hook into the YT player API.
Now that the video is initially a poster I cannot figure out how to detect when the player has loaded (after hitting the poster's play button) in order to manipulate it.