I'd like to be able to embed some IMDb trailers in a webpage. I found this stock IMDb tool that even produces the embed code for you...
The produced code looks like this:
<iframe src="https://www.imdb.com/video/imdb/vi1462938649/imdb/embed?autoplay=false&width=480" width="480" height="270" allowfullscreen="true" mozallowfullscreen="true" webkitallowfullscreen="true" frameborder="no" scrolling="no"></iframe>
Then I thought that by changing the vi9999999999 param in the iframe's source, I'd be able to get any other trailer embedded in my site... Wrong... Some videos play normally, while others complain about the x-frame-options: sameorigin directive/policy in effect...
If it didn't work at all, I'd perfectly understand that... But why does it work on some videos, and on some others it doesn't?
From the collection of iframes below, 50% of them work, while the other 50% don't...
<iframe src="https://www.imdb.com/video/imdb/vi2945515801/imdb/embed?autoplay=false&width=640" allowfullscreen="true" mozallowfullscreen="true" webkitallowfullscreen="true" scrolling="no" width="640" height="360" frameborder="no"></iframe>
<iframe src="https://www.imdb.com/video/imdb/vi1627823385/imdb/embed?autoplay=false&width=640" allowfullscreen="true" mozallowfullscreen="true" webkitallowfullscreen="true" scrolling="no" width="640" height="360" frameborder="no"></iframe>
<iframe src="https://www.imdb.com/video/imdb/vi2117384985/imdb/embed?autoplay=false&width=640" allowfullscreen="true" mozallowfullscreen="true" webkitallowfullscreen="true" scrolling="no" width="640" height="360" frameborder="no"></iframe>
<iframe src="https://www.imdb.com/video/imdb/vi3812212505/imdb/embed?autoplay=false&width=640" allowfullscreen="true" mozallowfullscreen="true" webkitallowfullscreen="true" scrolling="no" width="640" height="360" frameborder="no"></iframe>
<iframe src="https://www.imdb.com/video/imdb/vi1341915417/imdb/embed?autoplay=false&width=640" allowfullscreen="true" mozallowfullscreen="true" webkitallowfullscreen="true" scrolling="no" width="640" height="360" frameborder="no"></iframe>
<iframe src="https://www.imdb.com/video/imdb/vi4036933145/imdb/embed?autoplay=false&width=640" allowfullscreen="true" mozallowfullscreen="true" webkitallowfullscreen="true" scrolling="no" width="640" height="360" frameborder="no"></iframe>
<iframe src="https://www.imdb.com/video/imdb/vi1726152985/imdb/embed?autoplay=false&width=640" allowfullscreen="true" mozallowfullscreen="true" webkitallowfullscreen="true" scrolling="no" width="640" height="360" frameborder="no"></iframe>
<iframe src="https://www.imdb.com/video/imdb/vi4059824409/imdb/embed?autoplay=false&width=640" allowfullscreen="true" mozallowfullscreen="true" webkitallowfullscreen="true" scrolling="no" width="640" height="360" frameborder="no"></iframe>
<iframe src="https://www.imdb.com/video/imdb/vi719454489/imdb/embed?autoplay=false&width=640" allowfullscreen="true" mozallowfullscreen="true" webkitallowfullscreen="true" scrolling="no" width="640" height="360" frameborder="no"></iframe>
<iframe src="https://www.imdb.com/video/imdb/vi1392427289/imdb/embed?autoplay=false&width=640" allowfullscreen="true" mozallowfullscreen="true" webkitallowfullscreen="true" scrolling="no" width="640" height="360" frameborder="no"></iframe>
I'm totally confused about this. Can anyone shed some light on this please? TIA
Related
How to render the following html in UIwebview using loadHTMLString.
The webview is showing blank screen.
<html>
<head>
</head>
<frameset rows="1,*" frameborder=0 framespacing=0 cols="*">
<frame src="blank.html"
marginwidth="0" marginheight="0"
scrolling="no noresize">
<frame src="index1.html"
marginwidth="0" marginheight="0"
scrolling="yes noresize">
<noframes></noframes>
</frameset>
</html>
I used the following code in my show.html.erb file to load a youtube video. The video loads but any code after this is not executing.
<p>
<iframe id="ytplayer" type="text/html" width="640" height="390"
src="http://www.youtube.com/embed/<%=#video.youtubeid%>"
frameborder="0"/>
</p>
Change it to
<p>
<iframe id="ytplayer" type="text/html" width="640" height="390"
src="http://www.youtube.com/embed/<%=#video.youtubeid%>"
frameborder="0">
</iframe>
</p>
Refer this post
You should be able to use the <%= 'no line break' -%> syntax, as in:
<iframe id="ytplayer" type="text/html" width="640" height="390"
src="http://www.youtube.com/embed/<%= #video.youtubeid -%>"
frameborder="0">
</iframe>
Notice the extra dash at the end -%>
I have a site that will have several Youtube videos embedded using the standard Youtube iframe code.
I would like for these to be triggered via text link such as:
<p>Click Here to watch a puppy do something.</p>
<iframe width="420" height="315" src="http://www.youtube.com/embed/1AH9VEM_qC0?rel=0" frameborder="0" allowfullscreen></iframe>
Where the iframe is hidden by default but when the link is clicked the video shows in a jQuery UI modal window.
There will be multiple videos on a page.
Any direction is appreciated.
jsFiddle: http://jsfiddle.net/2Ur9M/38/
<div id="vid1" class="play">vid1</div>
<div id="vid2" class="play">vid2</div>
<div id="vid3" class="play">vid3</div>
<div id="ifvid1" style="display:none">1<iframe width="420" height="315" src="" frameborder="0" allowfullscreen></iframe></div>
<div id="ifvid2" style="display:none">2<iframe width="420" height="315" src="" frameborder="0" allowfullscreen></iframe></div>
<div id="ifvid3" style="display:none">3<iframe width="420" height="315" src="" frameborder="0" allowfullscreen></iframe></div>
<script>
$(function()
{
$(".play").each( function( index )
{
$(this).click( function()
{
$("#if"+$(this).attr("id")).dialog(
{
modal: true
});
});
});
});
</script>
When I put
<iframe width="560" height="349" src="<%= #video.link %>"></iframe>
Everything shows up fine. But the actual video won't play.. what am I doing wrong?
<iframe width="560" height="349" src="http://youtu.be/PF9-lstnLvo">
<html lang="en" dir="ltr">
</iframe>
HELP!!
Wrong src at iframe, it need to be like:
http://www.youtube.com/embed/PF9-lstnLvo
You need to add code:string to you Video model.
Or method code, which return you this code from #video.link like this:
def code
self.link.split('/').last if self.link
end
And replace erb:
<iframe width="560" height="349" src="<%= "http://www.youtube.com/embed/"+#video.code %>"></iframe>
I have an image, and I would like to make the image link to an embedded YouTube video, such that if the user clicks on the image, it starts playing in the place where the picture used to be. Any thoughts on how I can accomplish this?
Thank you,
David
Place the embedded video in a div that is invisible:
<div id="video" style="display: none;"> embedded video code here </div>
Then give the img an id too:
<img id="videopic" src="videopic.jpg" alt="Video Picture" />
Then, put a link round the image pointing to some JavaScript which hides the image and shows the embedded video:
<a href="javascript:document.getElementById('video').style.display = 'block'; document.getElementById('videopic').style.display = 'none'; void(0);">
<img id="videopic" src="videopic.jpg" alt="Video Picture" />
</a>
So, the full code would be:
<div id="video" style="display: none;"> embedded video code here </div>
<a href="javascript:document.getElementById('video').style.display = 'block'; document.getElementById('videopic').style.display = 'none'; void(0);">
<img id="videopic" src="videopic.jpg" alt="Video Picture" />
</a>
<div id="hideThisUltraCoolVideoFromYou" style="display:none;">
<object style="height: 390px; width: 640px">
<param name="movie" value="http://www.youtube.com/v/V4jZ_BV4MQ4?version=3&autoplay=1">
<param name="allowFullScreen" value="true">
<param name="allowScriptAccess" value="always">
<embed src="http://www.youtube.com/v/V4jZ_BV4MQ4?version=3&autoplay=1" type="application/x-shockwave-flash" allowfullscreen="true" allowScriptAccess="always" width="640" height="390"></object>
</div>
<img style="width:640px;height:390px;cursor:pointer;" src="thisPictureInsteadOfVideo.jpg" onclick="this.style.display='none';document.getElementById('hideThisUltraCoolVideoFromYou').style.display='block';" />
something like this :)