Iframe background video not working on some Iphones - javascript

I am creating a single page website on squarespace and I added a background video using Iframe and grabbing src from vimeo. I have researched and learned that safari does't play videos if they are not muted, so I attempted to mute and added other suggestions like inline but still the video won't play. I have also noticed though that on my friends Iphone 10 it worked, and on someone else's Iphone 10 it didn't? I made sure both had low power mode off so I am not sure if it's my code or if it could be possible settings differences they both have? Here is the Iframe code. Also here is the squarespace website, password is david. (if you open this on mobile ignore the big font I haven't adjusted size on that yet). Any potential leads or tips would greatly help! I have been going in circles all weekend trying to get to the bottom of this.
<iframe id="v0" src="https://player.vimeo.com/video/318621793?background=1&autoplay=1&loop=1&byline=0&title=0&playsinline=0&muted=1" frameborder="0" webkitallowfullscreen playsinline autoplay mozallowfullscreen allowfullscreen muted >
</iframe>

You may need to include most Video.type like mp4, MPEG-4,etc..
For all platform

Related

adding youtube live streaming video to my site

I want to add youtube live streaming video to my site this is the link
https://www.youtube.com/watch?v=EGYAnAoMbmA
and this is the code but it did not work:
<iframe width="560" height="315" src="https://www.youtube.com/watch?v=EGYAnAoMbmA" frameborder="0" allowfullscreen></iframe>
As the folks in the comments suggest, you should check to see if your YouTube video allows embedding.
Google has this procedure. Briefly speaking, first sign into YouTube, then go to your Video Manager. Click Edit beside the video you want to embed, then under the "advanced settings", find the "Distribution Options" and make sure the "Allow embedding" checkbox is checked; otherwise the embed will not work.
The good thing is that there appears to be no problem with your embed code, so it should only be a matter of making sure your video is even embeddable.

How do I get an embedded youtube video to autoplay suggested videos?

The title pretty much sums my question up. I've given a cursory glance to https://developers.google.com/youtube/iframe_api_reference and have searched online but all I have found are explanations on how to get an embedded video to autoplay (the first video only) while preventing the suggested videos list at the end. I think that perhaps the logic for playing suggested videos is only supported on youtube.com itself, a conclusion that might be supported by the autoplay button being outside of the video element.
As a worst case solution, I thought maybe if I could save a youtube.com page to my desktop I could modify the styling to only show the video. But alas, the page breaks when I try to load it from my hard drive as opposed to the website.
Edit: Take note that I'm talking about two different types of autoplay here. One is the autoplaying of suggested videos as seen in the picture, and that is the type of autoplay I want to be able to use in an embedded player. The other type of autoplay that I don't need help with is getting the embedded player to automatically play the video that is contained in its iframe src, aka the first video.
Since you marked iframe under your tags and I can't comment, I will try to answer.
If you're using iframe then make sure
autoplay=1"
is on
<iframe id="ytplayer" type="text/html" width="720" height="405"src="https://www.youtube.com/embed/M7lc1UVf-VE?autoplay=1"frameborder="0" allowfullscreen>
I found a link that will build it for you. It was a bit into the api link you gave.
https://developers.google.com/youtube/youtube_player_demo
You can give it the video and tell it what you want it to do.

Mozilla opens youtube video in flash player

In my web app I have to embedd youtube videos, for that I am using iframe. it works properly in chrome in html5 player. but when I am trying in mozilla firefox the video plays in flash player. how do I force mozilla to open the video in html player. I'm using mozilla version 36. please help me.
code used ::
<iframe type="text/html" width="100%" frameborder="0" allowfullscreen height="315" src="http://www.youtube.com/videoLink">
You are using an outdated browser ! please upgrade
</iframe>
Youtube's JS picks the version it thinks is right for you. The decision is made based on various factors, one that might be relevant is that although Firefox supports the VIDEO element it does not (yet) support the so-called Media Source Extension functionality. I have no idea if that's why YouTube chooses to use Flash rather than a VIDEO element, but it may be one of the factors.

iFrame fails to load in iOS Safari until reloaded

I have a simple iframe which is used to display a vimeo video on my site, as so:
<div class="video">
<iframe src="//player.vimeo.com/video/88893424" width="960px" height="540px" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen>
</iframe>
</div>
And it works like a charm on all standard computer browsers. Ajax is used throughout the site, and transitioning between pages that have videos and don't work exactly as you would expect - Ajax grabs the new page content, slides it on, deletes the old content, and the video works perfectly.
However, on iOS Safari, the video does NOT load. The space for the video is reserved - the other content on the page flows around the area where the video should be, which tells me the div is loading, and the height and width information of the iframe element is being registered by the browser. But no video, nothing. Reload the new page, though, and the video is there and plays just fine.
So my question is: Why is the reload required? What could I be doing wrong that is causing the AJAX to fail? I have read several answers across SO that seem to incriminate header information and cross-site drama, but it is danced around and not explained. Can anyone give me a clear understanding of what's going on here?

Youtube embedded video views do not count

Many resources claim that views of embedded youtube video DO count, if it there is no autoplay. But it doesn't count actually, and there is no autoplay! The code is:
<iframe width="420" height="315"
src="//www.youtube.com/embed/bPnFnHSSO3E?rel=0"
frameborder="0" allowfullscreen>
</iframe>
The views of the video using this code DO NOT COUNT even if I play the whole embedded video till the end! The views are incremented if watched directly on youtube, so it is not the "300 views problem".
I have tried to add the enablejsapi option, but it doesn't work as well.
<iframe width="420" height="315"
src="//www.youtube.com/embed/bPnFnHSSO3E?rel=0&enablejsapi=1"
frameborder="0" allowfullscreen>
</iframe>
The rel=0 option is not affecting that either.
I have found several resources mentioning the issue but without clear solution:
http://en.forums.wordpress.com/topic/my-embedded-videos-dont-count-as-views-on-youtube
https://productforums.google.com/forum/#!topic/youtube/MYnJlwIPEts
https://answers.yahoo.com/question/index?qid=20130215234209AAE0jH7
I was testing this in Chrome 34.0.1847.131 m (current version) in such a way that I had the video open on youtube, reloaded it, and the view count was one higher. Then I loaded the embedded videos in another tab, ran them till the end several times (sometimes I even tried to use private window and different IPs using two different proxies), and I reloaded the window on youtube - the view count was still only +1 higher, not +3 or +4 higher as it should be.
Your video have 301 views, its a security system for the views, look:
When a video reach 301 views, the counter stop (is still counting on background) but youtube checks for the authenticity of the views, this takes a couple of days, remember, youtube works on a lot of servers at the same time, so they need to gather all the views metadata and aprove it (because a lot of people use robots to get a lot of views).
After aproval the view count goes back to normal.
Hope it helps
PD: sorry for the bad english.
The only way to work around this I found was to check the Use old embed code option:
so it generated the old embed code with <object>, <embed> and <param>:
<object width="420" height="315"><param name="movie"
value="//www.youtube.com/v/bPnFnHSSO3E?version=3&hl=en_US"></param><param
name="allowFullScreen" value="true"></param><param name="allowscriptaccess"
value="always"></param><embed
src="//www.youtube.com/v/bPnFnHSSO3E?version=3&hl=en_US"
type="application/x-shockwave-flash" width="420" height="315"
allowscriptaccess="always" allowfullscreen="true"></embed></object>
This way, the views of embedded video DO count! (tested in Chrome 34.0.1847.131 m).
As noted in the youtube documentation, this code only supports Flash, not HTML5.
This is not a good solution though! But I don't know of any better now.

Categories

Resources