I am having a URL of some MSN video as http://video.in.msn.com/watch/video/the-help-theatrical-trailer/fcvrtnl7,
I would like to create a HTML document in such a fashion so that if I load that HTML document then, only that running flash content present in the link mentioned below should come. I have created a HTML doc but when I load that, I am able to see only Flash player on my page , it is not playing any video content in that.
Below mentioned is the HTML code. Please advice am I missing execution of any Javascript, if yes then how to identify which is the required Javascript to get the video loaded in the flash player.
<html>
<body topmargin="0" leftmargin="0">
<embed
type="application/x-shockwave-flash"
src="http://img.widgets.video.s-msn.com/v/5407.02/fl/player/current/player.swf"
width="800" height="450" "autoplay=false"
type="application/x-shockwave-flash"
id="rich_embed_460916691"
data="http://img.widgets.video.s-msn.com/v/5407.02/fl/player/current/player.swf"
PARAM=""
bgcolor="#000000"
allowScriptAccess="always"
quality="high"
wmode="window"
allowFullScreen="true"
flashvars="playlistmin=11&ps=10&mode=destination&ifs=true&playAdBeforeFirstVid=true&endslateTime=1&slateAd=true&pl=false&adaptiveBuffering=false&hideShare=false&hideInfo=true&hideSearch=true&hideMoreVideos=true&hidePlaylist=true&rst=v5&mkt=en-in&fr=dest_en-in&reportingType=dest&brand=v5%5e800x450&adEventTimeout=15&adFull=Web&adPartial=Partial&adModelType=MSN&adDivs=ux1_2_1_300x60ad_msn%2c300%2c60%3bplayer1000x650ad%2c1000%2c650%3bplayer1380x1024ad_temp%2c1380%2c1024%3bplayer1380x650ad%2c1380%2c650&timePlaying=60&videosPlayed=1&ad=true&vc=catalog.video.msn.com&vce=edge1.catalog.video.msn.com%2cedge2.catalog.video.msn.com%2cedge3.catalog.video.msn.com%2cedge4.catalog.video.msn.com&vci=img1.catalog.video.msn.com%2cimg2.catalog.video.msn.com%2cimg3.catalog.video.msn.com%2cimg4.catalog.video.msn.com&msnlink=true&linkOverride2=http%3a%2f%2fvideo.in.msn.com%2f%3fmkt%3den-in%26vid%3d%7b0%7d%26from%3d&linkBack=http%3a%2f%2fvideo.in.msn.com%2f&ap=true&widgetId=ux1_2_1_1_5&rv=true&rvp=false&versionPath=%2fv%2f5407.02%2f&qualityOverride=LO"
/>
</body>
</html>
On the page you refer to there is a 'Share' button.
If you click it, it gives you the code you can copy and paste:
<iframe
width="432"
height="243"
frameborder="0"
marginwidth="0"
marginheight='0'
scrolling="no"
src="http://hub.video.msn.com/embed/b7dad6f8-9355-4ccc-8b1b-d6eea6f28764/?vars=bWt0PWVuLWluJmJyYW5kPXY1JTVlODAweDQ1MCZsaW5rb3ZlcnJpZGUyPWh0dHAlM2ElMmYlMmZ2aWRlby5pbi5tc24uY29tJTJmJTNmbWt0JTNkZW4taW4lMjZ2aWQlM2QlN2IwJTdkJTI2ZnJvbSUzZCZsaW5rYmFjaz1odHRwJTNhJTJmJTJmdmlkZW8uaW4ubXNuLmNvbSUyZiZjb25maWdDc2lkPU1TTlZpZGVvJmNvbmZpZ05hbWU9c3luZGljYXRpb25wbGF5ZXImc3luZGljYXRpb249dGFnJnBsYXllci5mcj1zaGFyZWVtYmVkLXN5bmRpY2F0aW9u">
Video: The Help: Theatrical trailer
</iframe>
As #GabrielTheron suggested it is an iframe.
I'm no expert here, but perhaps an iframe might be easier/better to use?
I know it's quite a common way to use external content in a webpage (especially Flash content).
Related
I am making a website and I have to show a video on its homepage. The video exists on youtube and I need to embed it on my website.
<html>
<iframe width="560" height="315" src="https://www.youtube.com/embed/spPdelVEs_k?rel=0" frameborder="0" allow="autoplay; encrypted-media" allowfullscreen></iframe>
</html>
Unfortunately my webpage shows a completely different video. It shows this one.
https://www.youtube.com/watch?v=7sNL0T93ItM
Does the URL convert to something different? Help me solve this problem.
Your code is fine. You just need to clear the cookies on your browser and then it should load fine for you.
This is the video your code goes to:
https://www.youtube.com/watch?v=spPdelVEs_k
I have created html page:
http://time.graphics/embed?v=1&id=4
I want create widget embed code:
<iframe width="600" height="400"
src="" http://time.graphics/embed?v=1&id=4
frameborder="0" allowfullscreen></iframe>
But it doesn't work, here the codepen:
https://codepen.io/jenkaman/pen/MoQzNo
Please, help. What's going on? How to create widget, which will be shown on any website. Thanks.
Problem solved!
Need use a https!
I've been trying to get a videos source from a website and play it in my own application. When I run, it just end up on the front page of that website.
example:
<!DOCTYPE html>
<html>
<body>
<a id="play-video" href="#">Play Video</a><br />
<iframe id="video" width="420" height="315" src="http://vkpass.com/token/bdrxwnlzfjpq/vklhash/Pw7Iy8MztzzwN6xh7nOhf6o80rxCAYIhP8xiQFZ2fGX2.a1aa2ZoFDfJvKt0cycHuydloxHztEjWaRXccGVjbw==?source=v1#" frameborder="0" allowfullscreen></iframe>
</body>
</html>
Am I doing something wrong or is there a way around this?
Delete href="#" from <a> tag.
The website has some sort of anti-embedding script that won't allow you to play the video.
But the answer to stop the redirecting would be to use the sandbox attribute that HTML5 has for iframe objects.
<iframe id="video" width="420" height="315" src="http://vkpass.com/token/bdrxwnlzfjpq/vklhash/Pw7Iy8MztzzwN6xh7nOhf6o80rxCAYIhP8xiQFZ2fGX2.a1aa2ZoFDfJvKt0cycHuydloxHztEjWaRXccGVjbw==?source=v1#" sandbox="" frameborder="0" allowfullscreen></iframe>
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/iframe
If specified as an empty string, this attribute enables extra
restrictions on the content that can appear in the inline frame. The
value of the attribute can either be an empty string (all the
restrictions are applied), or a space-separated list of tokens that
lift particular restrictions. Valid tokens are:
And one of the options is
allow-top-navigation
[Which] allows the embedded browsing context to navigate (load)
content to the top-level browsing context. If this keyword is not
used, this operation is not allowed.
By excluding this option in the sandbox attribute, it DOES NOT allow redirecting/top-level navigation.
Use video tag instead and remove the anchor tag for play video. Also there is something wrong with the src link of iframe tag, its returning a redirect response instead of video. You can check that by changing the src to the code here and when you download that you will get an HTML page.
<!DOCTYPE html>
<html>
<body>
<video autoplay="true" width="320" height="240" controls loop="true" preload="auto" src="https://s3.ap-south-1.amazonaws.com/habba-cdn/assets/Video/Home-page.mp4"> </video>
</body>
</html>
I'm tried your code in my local and it stops redirecting when i'm including the property sandbox="" as #X33 mentioned and in the console it is showing an error like
Blocked script execution in 'http://' because the document's frame is sandboxed and the 'allow-scripts' permission is not set.
This link may help you
stackoverflow Question
I trying to display my ppt with long time where the screen should run continuously in web page where the file is in my local folder but it is not showing in web page. The code is below :
<!DOCTYPE html>
<html>
<body>
<iframe src="lp.ppt" width="800px" heigt="600px" name="iframe_a"></iframe>
</body>
</html>
can anyone help to display ppt in html page.
You can use Google Docs to serve as your document viewer. You just need to upload your file and use the share link as the iframe src.
You can get the embed code by uploading your file and opening it in google docs (in this case, Google Slides) then click the file tab and click the Publish to the Web. From there you can copy the embed code. Make sure that the file is public! :)
<iframe src="https://docs.google.com/presentation/d/17nlO95lz91-shRep16UiJl-3EAxv-MnOFH718ku2gtw/embed?start=false&loop=false&delayms=3000" frameborder="0" width="960" height="749" allowfullscreen="true" mozallowfullscreen="true" webkitallowfullscreen="true"></iframe>
<iframe src="https://docs.google.com/presentation/d/17nlO95lz91-shRep16UiJl-3EAxv-MnOFH718ku2gtw/embed?start=false&loop=false&delayms=3000" frameborder="0" width="960" height="749" allowfullscreen="true" mozallowfullscreen="true" webkitallowfullscreen="true"></iframe>
Hope this helps!
I had problems covering videos on Youtube itself but solved that with a design change (don't need to cover them any more).
So I have a script the user can run and it calls a javascript file to do other stuff on the current webpage. One thing it does is bring up a lightbox that covers the page. Of course it won't cover embedded Youtube videos and so I need to do a few changes. I did the necessary changes and it didn't work. I kept trying and trying and eventually made a page with just an embedded video and a .jpg (my script won't run if there are no images).
I looked to see what the Pinterest script added to the embedded video portion and while it was almost identical they did have an autoplay=0 in there so I added it just so I could see for myself that it is exactly the same. If I run the Pinterest script and close it, then run mine, mine works fine. If I run mine, then the Pinterest script, then mine again, mine works. So I believe this means I'm not adding anything that tells the page "Go ahead and put the video on top anyway."
My portion of the script that adds the wmode:
var players = document.getElementsByTagName('embed');
var len = players.length;
for(var i=0;i<len;i++){
players[i].setAttribute('wmode', "transparent");
players[i].src += "?autoplay=0&wmode=transparent";
}
Minimal page html:
<html>
<head>
</head>
<body>
<img src="img/title.jpg">
<object width="425" height="350">
<param name="movie" value="http://www.youtube.com/v/OOpkr8uNWpk"></param>
<embed src="http://www.youtube.com/v/OOpkr8uNWpk" type="application/x-shockwave-flash" width="425" height="350"></embed>
</object>
</body>
After Pinterest script:
<object width="425" height="350">
<param name="movie" value="http://www.youtube.com/v/OOpkr8uNWpk">
<embed src="http://www.youtube.com/v/OOpkr8uNWpk?autoplay=0&wmode=transparent" type="application/x-shockwave-flash" width="425" height="350" wmode="transparent">
</object>
After mine:
<object width="425" height="350">
<param name="movie" value="http://www.youtube.com/v/OOpkr8uNWpk">
<embed src="http://www.youtube.com/v/OOpkr8uNWpk?autoplay=0&wmode=transparent" type="application/x-shockwave-flash" width="425" height="350" wmode="transparent">
</object>
Since they are the same, I have no idea why it is not working.
The wmode may be visible in the html but has not taken effect - try cloning and replacing the html of the flash to force a reload (just to see if that's really the problem, I think changing the src forces a reload but I'm not sure)
Also, can you paste the html/css of the lightbox or make a jsfiddle that can demostrate the problem?