i'm developing an html5 mobile app...i have to create a page with a YouTube Video and some other elements...i use the iframe code to load the video...
<iframe width="100%" height="auto" src="http://www.youtube.com/embed/VIDEO-ID" frameborder="0" allowfullscreen></iframe>
this works...the problem is when a user doesn't have internet connection...i'd like to present an image...How is it possible?!
Thanks
Assuming you are okay with javascript:
<script type="text/javascript">
if(navigator.onLine!==true)
document.getElementsByTagName('iframe')[0].outerHTML='<img src="blah.png">';
</script>
You can use something else instead of document.getElementsByTagName('iframe')[0] if you have more than one iframe in the page.
Related
I want to embed a Youtube video on my website. I have tried the following code but it does show the video or any controllers:
<iframe width="400" height="300"
src="https://www.youtube.com/watch?v=z-QgsXkYqjc"
frameborder="1"
allowfullscreen></iframe>
Anyone know what I am doing wrong?
Much appreciated.
Change the src to this:
src="https://www.youtube.com/embed/z-QgsXkYqjc"
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 am new to HTML and when I am trying to embed a youtube video in my html page using iframe tag, then it is getting embedded very well. Please see code below:
<iframe width="420" height="320" src="https://youtube.com/embed/FiMl6n64bTg"></iframe>
But when i am trying to run that video in my html page then it is showing
The video contains content from multi screen media. It is restricted from playback in certain sites. Watch on Youtube..
How can i run youtube video in my html page without this error/issue.
Thanks in advance!!!!
Try this
<iframe title="YouTube video player" class="youtube-player" type="text/html"
width="420" height="320" src="https://youtube.com/embed/FiMl6n64bTg"
frameborder="0" allowFullScreen></iframe>
I have been trying to play a youtube video in a windows 8 html5 & javascript app with no luck!
I tried copy pasting the code youtube provided for embedding videos in the body of default.html, for example:
<iframe width="420" height="315" src="http://www.youtube.com/embed/k07IaB9yq_U" frameborder="0" allowfullscreen></iframe>
This gives the following error:
The Adobe Flash player or an HTML5 supported browser is required for video playback.
Get the latest flash player
Learn more about updating an HTML5 browser.
when I try using the video tag with the previous link, for example:
<video src="http://www.youtube.com/embed/k07IaB9yq_U" controls></video>
It says an invalid source!
What is the right way to do this?
Thanks
YouTube has a beta program to provide some videos in HTML5. You can join it here . Once you have done that you should be able to embed HTML5 YouTube videos in a WebView control by navigating to the YouTube URL.
Flash videos cannot be displayed in a Metro style app.
Code for the webview control
string htmlFragment =
#"<!DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.0 Transitional//EN' 'http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd'>
<html>
<head>
<title>YouTubePagesample</title>
</head>
<iframe width='560' height='315' src='http://www.youtube.com/embed/{YoutubeID}' frameborder='0' allowfullscreen></iframe>
<body>
</body>
</html>;";
this.webView.NavigateToString(htmlFragment);
Use the setInnerHTMLUnsafe method as win 8 apps don't like the external JS being injected in the app. videoPlayer is the div which you want to add the embed to.
var content = '<iframe width="480" height="270" src="http://www.youtube.com/embed/8sPj0Ic8KQ8?rel=0" frameborder="0" allowfullscreen></iframe>' ;
WinJS.Utilities.setInnerHTMLUnsafe(videoPlayer, content);
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.