I'm making a hybrid app that requires a video to be played on the page, and not in the native fullscreen video player on an iPhone. I have tried webkit-playsinline in an iframe with the YouTube API, but it is not working. Heres the iframe code:
<iframe id="player" type="text/html" width="640" height="360"
src="https://www.youtube.com/embed/morestuffhere"
frameborder="0" webkit-playsinline></iframe>
I also put his in my viewDidLoad for Swift:
webView.allowsInlineMediaPlayback = true
But the native player shows up no matter what. What could I be doing wrong here?
The inline attribute should be placed on the video element, not on the iframe element. If you use the iframe method you cannot enable the inline playback this way since the actual video element won't have the required attribute.
<iframe id="player" type="text/html" width="640" height="360"
src="https://www.youtube.com/embed/morestuffhere&playsinline=1"
frameborder="0"></iframe>
Also put webView.allowsInlineMediaPlayback = true in viewDidLoad for Swift
Related
Here is the link in the Vimeo iframe:
<iframe
title="vimeo-player"
src="https://player.vimeo.com/video/348628277"
width="640"
height="360"
frameborder="0"
></iframe>
The above works.
But the below does not work:
<video src="https://player.vimeo.com/video/348628277" autoPlay="true" loop />
It does not work because the link is to the webpage, not the video. How do I get the URL to the video then?
You can use some of the third-party websites to get the mp4 links of different video qualities, like :
https://en.savefrom.net/11-how-to-download-vimeo-video
https://www.savethevideo.com/vimeo-downloader
I see the following code to embed HTML5 video
<iframe src="https://player.vimeo.com/video/12345?autoplay=1&loop=1&autopause=0" width="500" height="281" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>
My question is the query params given in the code above
autoplay=1&loop=1&autopause=0
Do that query params work directly with the video (meaning is that HTML5 standard which the browser understands) OR is this something which is mapped internally by the iframe page to the actual HTML5 attributes ?
They are just parameters passed to https://player.vimeo.com which interprets them and creates the <iframe> content based on them.
googles just updated there "Autoplay Policy Changes" but I want to implement a muted auto-playing Vimeo background video and after reading the article I believed adding the following to the iframe would work.
chrome version: 68
allow="autoplay; fullscreen"
but no luck and I'm not sure what else to try other then the JS API which i don't even know if it will make a difference.
<iframe src="https://player.vimeo.com/video/265188275?autoplay=1&loop=1&autopause=false&byline=false&title=false&byline=false&frameborder=0" allow="autoplay; fullscreen">
thanks in advance for any helpful advice.
If you're using the Vimeo embedded iframe player as a background video, you should use the embed code with the background parameter instead of the autoplay and loop parameters:
<iframe src="https://player.vimeo.com/video/76979871?background=1" width="640" height="360" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>
The background parameter will hide all player buttons and elements (play/pause, playbar, title, byline, etc.), loop the video, autoplay the video, and mute the video. That last part is important - by default, Chrome will always allow muted videos to autoplay. For videos to autoplay with audio turned on, Chrome uses a "Media Engagement Index" to determine if the viewer actually wants or expects video with audio to autoplay when navigating to your page. That whole process is documented by Google here: https://developers.google.com/web/updates/2017/09/autoplay-policy-changes
The background parameter of the Vimeo Player is documented here: https://help.vimeo.com/hc/en-us/articles/115011183028-Embedding-background-videos
I want to embed TuneIN player to my site so it autoplay.
Code is:
<iframe src="https://tunein.com/embed/player/s281461/" style="width:100%;height:100px;" scrolling="no" frameborder="no"></iframe>
I tried including ?autoplay=1 in url but no luck.
Note: I won't use custom player because it won't provide currently listening track.
If you want your TuneIN embed stream to autoplay here is code:
<iframe src="http://tunein.com/embed/player/s96692?autoplay=true"
style="width:100%;height:100px;" scrolling="no" frameborder="no"></iframe>
Just replace
http://tunein.com/embed/player/s96692
with your station url.
I have taken the following iframe code for the youtube video from the youtube itself.
<iframe width=”560? height=”315? src=”http://www.youtube.com/embed/V3oJR5IAMxM” frameborder=”0? allowfullscreen></iframe>
But when i try to embed this video on simple web-page inside a div element. I can see the you-tube player in the web page.But the video is not loading in my webpage. But the same video is playing for me in youtube.
Can someone tell what might be the problem,..
Is the problem with a code or with the browser, i am using mozilla 13.
HiTbmBizz,
Try this instead,
<iframe width="640" height="360" src="http://www.youtube.com/embed/V3oJR5IAMxM?feature=player_embedded" frameborder="0" allowfullscreen></iframe>
Worked for me in HTMLSandbox if you want to test.
Let me know how it goes.