Adding the YouTube iframe to a Cordova app on iOS - iframe

I'm using Cordova 3.0 and am trying to embed a YouTube video inside an article of my news app. The YouTube code looks like this:
<iframe width="600" height="450" src="//www.youtube.com/embed/_OBlgSz8sSM" frameborder="0" allowfullscreen></iframe>
In its current form the code does nothing except leave a large wide white square in the DOM. When I inject the letters http: so that it looks like this:
<iframe width="600" height="450" src="http://www.youtube.com/embed/_OBlgSz8sSM" frameborder="0" allowfullscreen></iframe>
then the app automatically quits and goes to the browser. How can I just make the iframe behave as it should, as a little window. I have followed the steps mentioned in this question and have tried fiddling with the <preference name="stay-in-webview" value="false" /> line in the config.xml file.

Is this what you are looking for
Force HTML5 youtube video
<iframe src="http://www.youtube.com/embed/_OBlgSz8sSM?html5=1"></iframe>
OR may be
Show Youtube video source into HTML5 video tag?
Step 1: add &html5=True to your favorite youtube url
Step 2: Find tag in source
Step 3: Add controls="controls" to video tag:
<video controls="controls"
class="video-stream"
x-webkit-airplay="allow"
data-youtube-id="N9oxmRT2YWw"
src="http://v20.lscache8.c.youtube.com/videoplayback?sparams=id%2Cexpire%2Cip%2Cipbits%2Citag%2Cratebypass%2Coc%3AU0hPRVRMVV9FSkNOOV9MRllD&itag=43&ipbits=0&signature=D2BCBE2F115E68C5FF97673F1D797F3C3E3BFB99.59252109C7D2B995A8D51A461FF9A6264879948E&sver=3&ratebypass=yes&expire=1300417200&key=yt1&ip=0.0.0.0&id=37da319914f6616c"></video>
More SF posts:
YouTube video in HTML5
Force HTML5 youtube video

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!

how to embed and share MP3 file?

I've got a my own website and I've put on my website a radio interview (MP3 file). On my website there is a tool which takes the MP3 file and plays it.
My file URL is "http://www.abc.com/invterview/July 9 interview.MP3"
Now, another website wants to play the same file and asks me to give te embed/share link.
Can someone help me how to accomplish this link?
I googled and found this webpage http://www.labnol.org/internet/design/html-embed-mp3-songs-podcasts-music-in-blogs-websites/2232/ ,which explains how to accomplish an EMBED, but I've never done this and I know Chrome, IE, FF, Safari have it's own instructions...
So can someone guide me how to accomplish an EMBED URL so it will work on all Browser?
Do I need to use or what is the common use??????
if it was video file I could upload it to Youtube and send that link, but this is a MP3 file.
thanks
You could use HTML5, which has native support for playing audio.
<audio controls="controls" height="100" width="100">
<source src="song.mp3" type="audio/mp3" />
<source src="song.ogg" type="audio/ogg" />
<embed height="100" width="100" src="song.mp3" />
</audio>
If a browser does not support HTML5, the code above will fallback to the embed code.
Other than that, you could use the yahoo media player. It's not the coolest or best around, but it's simple and it gets the job done.
Play Song
<script type="text/javascript" src="http://mediaplayer.yahoo.com/js">
</script>

Is not possible to toggle fullscreen in iframe for flash video?

I'm using embed code to do live stream and the embed code like youtube one works perfectly
but some of them I have to use code such as iframe the fullscreen feature doesn't work.
<iframe src="linkhere" width="600" height="450"/>
and I can not toggle the video into fullscreen
will it be any possible way to make it fullscreen if they click on the option?
or will it be any other embed code that similar to iframe to use?
Your problem could be that the flash plugin recognises iframe as your "fullscreen"..
When looking at the youtube embed code, i recognised a function "allowfullscreen" within the iframe definition
make sure you also have this part in your code..
<iframe width="560" height="315" src="http://www.youtube.com/embed/NWHfY_lvKIQ" frameborder="0" **allowfullscreen**></iframe>
else there might be another option beside an iframe..

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