I've added embedded videos on my website's 'Video' section. A weird thing's happening, though. If I play the video, then 'X' out the window while the video's playing, the audio still plays even though the window is closed.
So it seems like "closing" my window doesn't really close the video. I've added "?enablejsapi=1" to the end of the YouTube URL to enable the YouTube API, but I'm not sure what my next step is.
How do I set up the iframe so the video stops playing when the modal window is closed/X'ed out?
Here's the code for that window + embedded iframe:
<article id="videos">
<h2 class="videos">Our Work</h2>
<iframe width="560" height="315" src="https://www.youtube.com/embed/973w2QTswQI?enablejsapi=1" frameborder="0" allowfullscreen></iframe>
<p>Adipiscing magna ...</p>
<p>Nullam et orci ...</p>
</article>
I don't think it's integrated in modals to stop vidoes when you press X. You have to explicitly include in the function that you want to stop the video using stopVideo command.
Related
When playing an inline, autoplay video on an iPhone with a low battery, iOS requires the user to tap on the video to start it. (this makes sense... They want to save battery life by preventing videos from playin)
However, from what I can tell, this also leads to an adverse side effect: It is not possible to click through if the video has an href link.
Any workarounds to this?
Here's an idea of how I'm trying to do it:
<a href="http://www.link.com">
<video width="100%" autoplay loop muted playsinline>
<source src="https://source.mp4" preload type="video/mp4"></video>
</a>
add &rel=0 like this
src="https://source.mp4&rel=0"
I have a youtube video in my website. Here is the code :
<iframe width="100%" height="100%" src="//www.youtube.com/embed/<?php echo $youtube_key; ?>?autoplay=0&showinfo=0&controls=0&modestbrandin=1&rel=0" frameborder="0" allowfullscreen>
I want that user can only see the video. I mean user can play it or pause it. No other control even I DON'T WANT user can right click on the video player.
Now this code invisible all option but user can right click and can copy the url :(
How can I implement this type of youtube in my website where user can only see it only from my website. any suggestion ?
I was wondering if it is possible to autoplay an embedded YouTube video AND also have the video start at a certain point?
Any help is appreciated.
You can just add the & to place another command in the embed script. The ? starts the first command, the & adds another. The Start command is in seconds: 1min10sec=70secs. Then just top it off with an autoplay=1 to automatically start playing.
<iframe src="https://www.youtube.com/embed/acktYyOGG6w?start=29&autoplay=1" width="1" height="1" src="" frameborder="0" allowfullscreen></iframe>
I ran into the same issue for deploying music for my church's website. The width and height were only to make it a pixel in size so the video won't show while it plays.
You see another example when you look at the playlist links.
https://www.youtube.com/watch?v=of9C-8azVh8&index=4&list=PLBjhJqE72NDQPMNhB0peXyjDQNVxSext-
I’m developing an iOS app with a looping video embedded into a div. I’ve got the “webkit-playsinline” working so it prevents apple’s fullscreen video player from kicking in… but there’s a glitch. As soon as the video begins its first loop, for some reason it forgets that its set to play inline and goes fullscreen.
Here’s my workaround in case this is frustrating anyone else out there:
<video class=“myVideo” width="640" height="360" autoplay webkit-playsinline>
<source src=“video.mp4" type="video/mp4" />
</video>
Rather than adding the “loop” attribute to the video tag, I use jQuery’s .on function to play the video again when it ends like this:
var myVideo = document.getElementsByClassName('myVideo')[0];
$('.myVideo').on('ended',function(){
myVideo.play();
$('.myVideo').attr('webkit-playsinline', '');
});
I also reminded the video that we’re playing inline just incase it gets any funny ideas and tries to run in full screen mode on replay… viola! problem solved ;)
My iOS application uses youtube iframe player on UIWebView to play any clip with inline mode. The following code is HTML code used.
<html>
<head>
<style type="text/css">body {background-color: transparent;color: white;}</style>
</head>
<body style="margin:0">
<iframe src="http://www.youtube.com/embed/e2w8z6mI47U?playsinline=1&rel=0&showinfo=0" width="320" height="240" frameborder="0" allowfullscreen></iframe>
</body>
</html>
Then, it is passed to loadHTMLString method.
That code had worked well until a recent date. But, I recently noticed that every clips I used aren't played normally. the standby view and play button is shown but, although I pushed the play button, it didn't play well. black screen was only shown.
I haven't found anything to solve the problem. Are there any changes of Youtube Iframe player or points I missed?
I ended up solving the problem by calling [videoView setMediaPlaybackRequiresUserAction:NO].
I don't exactly know why the method could save me. At a guess, there was a change dealing with the request for playing at youtube. I could find the following changes on youtube developer site.
January 28, 2014
The playsinline parameter controls whether videos play inline or
fullscreen in an HTML5 player on iOS. Setting the value to 1 causes
inline playback.
The Selecting content to play section has been updated to explain how
to find YouTube video IDs and playlist IDs using the YouTube Data API
(v3) rather than the older API version.
The controls parameter's definition has been updated to reflect the
fact that the parameter value only affects the time that the Flash
player actually loads in IFrame embeds. In addition, for IFrame
embeds, the parameter value also determines when the controls display
in the player. If you set the parameter's value to 2, then the
controls display and the Flash player loads after the user initiates
the video playback.
I guess that one of above changes may need extra informations which are passed from a client to youtube server for playing normally.
UPDATE:
Today, I identified that it works well without my solution. It seems that the problem was fixed lately.