Vimeo iFrame only loads occasionally - iframe

This vimeo video loads fine on its own with the iframe snippet below
<iframe src="http://player.vimeo.com/video/19513284?byline=0&portrait=0&color=ffffff" width="350" height="192" frameborder="0" webkitAllowFullScreen mozallowfullscreen allowFullScreen></iframe>
But once loaded as part of this page, it will only work some of the time. I disabled all applicable CSS rules to that iFrame element, but it still won't load.
This happens on Chrome, Firefox and Safari, cleared cache or not.
Any thoughts?

That's because your site is secure. Browsers have started blocking insecure elements loaded on secure pages. The easiest solution is to remove the "http:" from the src of the iframe:
<iframe src="//player.vimeo.com/video/19513284?byline=0&portrait=0&color=ffffff" width="350" height="192" frameborder="0" webkitAllowFullScreen mozallowfullscreen allowFullScreen></iframe>
That will load via the proper protocol where necessary. Note that we are still working on getting our video files loading over https, but the embed will still work in the meantime (you'll just see a warning in the address bar in some browsers).

Your iFrame source needs to be https://

Related

Youtube iframe fullscreen

hope everyone is ok.
I need to build a page in our company's website where we're putting some videos of our production.
The problem is, i can't seem to find a way to make the videos available in fullscreen mode for the visitors.
I've done pratically every solution that i've found, but none seems to work. I've done:
<iframe allow="fullscreen;">
---
<iframe src="your_page_url"
allowfullscreen="allowfullscreen"
mozallowfullscreen="mozallowfullscreen"
msallowfullscreen="msallowfullscreen"
oallowfullscreen="oallowfullscreen"
webkitallowfullscreen="webkitallowfullscreen">
</iframe>
---
allowFullScreen="allowFullScreen" and frameBorder="0"
---
<iframe
id="player"
src="URL here"
allowfullscreen="true">
</iframe>
---
But none of that worked.. Any help here is welcome!
its very easy if you wants to add youtube videos in iframe .you just have to add iframe in src embed word like that
<iframe src="https://www.youtube.com/embed/watch?v=fbS2O4VETAo&t=2s" name="myFrame"></iframe>
after youtube.com/embed/Example url

Lazy sizes does not show video

I am using lazy sizes for the lazy load of my youtube videos. On every page the lazy load does work, but not on these two, more precisely, the whole video just disappears/is not displayed. The two pages are in the same folder as all other pages, which do work. The link to lazysizes.js is there <script src="lazysizes.min.js" async></script>
Here is the iframe on one of the working pages with the video being displayed:
<iframe width="640" height="360" data-src="https://www.youtube.com/embed/xxx?rel=0" importance="low" loading="lazy" frameborder="0" class="lazyload" allow="encrypted-media" allowfullscreen></iframe>
and here the iframe that just won't work/does not display the video - it's identical:
<iframe width="640" height="360" data-src="https://www.youtube.com/embed/3FOZ2CTaaWk?rel=0" importance="low" loading="lazy" class="lazyload" frameborder="0" allow="encrypted-media" allowfullscreen></iframe>
I know this just doesn't make sense, but my hope is that one of you stumbled upon the same problem. I have tried copying and pasting (swapped them, so it is not really the iframe code) and changing it, reloading the js etc. but nothing helps. The iframe is identical with the other pages. I have no idea how to find out what's missing here.
I'm stupid, the console revealed it: the lazysizes.min.js was loaded into the directory of this particular URL. Since this URL (and its /.../ directory) is artificially created the lazysizes.min.js could not be found in that directory (though on the FTP server the js file is in the same directory as the source php file that loads it) it could not be loaded.
A simple line of extra code that includes the lazysizes.min.js above the iframe embedment with an absolute URL to the js file solved the problem!

Invalid Parameters on playing youtube embedded on a website

At first I'm getting this error "This video contains content from sme. It is restricted from playback on certain sites" Then after reading this post I added few lines to my youtube emded url I'm now receiving a new error which says "Invalid Paramaters". By the way what I'm trying to do here is embed a youtube video on my site.
This is the original embed url of the youtube I'm trying to embed on my website. Where I'm receiving the error message "This video contains content from SME. It is restricted from playback on certain sites. Watch on Youtube".
<iframe width="420" height="315" src="http://www.youtube.com/embed/CFqbhsvXE7M" frameborder="0" allowfullscreen></iframe>
This is the editted one after reading the post. And getting this error "Invalid Paramaters".
<iframe width="420" height="315" src="http://www.youtube.com/embed/CFqbhsvXE7M?playlist=." frameborder="0" allowfullscreen></iframe>
I've done some research and it says YouTube indeed has changed their API over the last couple of days and flash fallback from their HTML5 Video Player fails. and I didn't find a clear explanation how to fix it. Using the original embed url the youtube plays well in my localhost. After I deployed it in a server I'm now receiving those errors. Is this something to do with the domain of the server I'm using?
Question:
How could I possibly fix this? T_T
Other Information: I'm using asp.net MVC3
Instead of using embed use watch and add in a few attributes, works all the time:
<iframe width="420" height="315"
src="http://www.youtube.com/watch?v=CFqbhsvXE7M"
frameborder="0"
webkitAllowFullScreen
mozallowfullscreen
allowFullScreen></iframe>

how to add CSS in this iframe

Can any one tell me how I can add my own CSS in an external site page through an iframe. So what code should I change here:
<iframe src="http://dhost.info/asz/demo.html" marginwidth="0" marginheight="0" scrolling="no" frameborder="0" height="232px" width="514px" id="Dir-go" allowtransparency="true" title="WebDir"></iframe>
You can't. Nor can you add a stylesheet to it though Javascript. You can't edit the DOM of another domain's Iframe. (Very secure and all.)
External domains Iframes you cannot do anything but, internal iframes (using own domain) you can do this by using DOM javascript.

How can I play a URL in an iframe?

I want to play a URL in an iframe. When I place any other URL in the following line, it works fine, but when I enter the YouTube URL I get a blank page. Can anyone tell me where I am going wrong, or suggest any other method by which I can play the YouTube URL in an iframe?
<iframe width="100%"
height="610px"
frameborder=0
marginwidth="0"
marginheight="0"
scrolling="yes"
name="frmTest"
src="http://www.youtube.com/watch?v=dG5irzonTXA">
</iframe>
Your code will open a normal YouTube page. If I'm correct you want to have an iframe with video in it.
Try this: https://developers.google.com/youtube/youtube_player_demo
There's lot's of documentation there too.

Resources