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!
Related
I an writing an vue3 web app using vite. I am using an dev framework call vue-vben-admin.
I try to embed an local html into iframe, but the iframe page keep showing the homepage
I put "test.html" in public/static/test.html
so my iframe page would be
<iframe id="f1" ref="frame1" :src="'static/test.html'"></iframe>
<iframe id="f2" ref="frame2" :src="'/static/test.html'"></iframe>
either ways it just won't work as expected.
The actual iframe url is "https://localhost:3100/static/test.html"
It seems that won't be an 404 problem because when I use Image, the following code work fine:
<Image src="/resource/img/logo.png" />
For me it just worked when I added the html file to the public folder, but then I had to omit the '/static', so I used
<iframe id="f1" ref="frame1" :src="'/test.html'"></iframe>
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
I tested lazy loading youtube videos on my site and the page speed improves by 3 seconds. I load a javascript and changed the src attribute for a data-src one.
Ex:
<iframe data-src="http://www.youtube.com/embed/VID" height="360" width="550"></iframe>
But I don't know if the iframe code can be modified and if this goes against Youtubes' terms and conditions: https://www.youtube.com/t/terms.
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://
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.