Need help with iFrames - html

I have an iframe like this :
<iframe width="985px" frameborder="0" marginheight="0" marginwidth="0" height="2100px" src="http://www.myblog.com/search?q=<?php echo $plus ?>searhed"></iframe>
Now in the iframe i want to add a button ( or something like that,can be an image),that will navigate to the previous page which the person was browsing.
Its like i want to add "Back" and "Forward" functions in any browser to my iframe.
Thanking you.

Take a look at javascript function history.back()

Related

how to disable autoplay video in iframe

I have tried the following code:
<iframe controls="0" autoplay="0" class="embed-responsive-item" src="videos/first_video.mp4"></iframe>
I have tried many things but not getting any solution. I want to disable the autoplay on the video and don't want to use <video> tag so its possible without <video> tag?
I think this is what you want.
function a() {
var iframe = document.getElementById("iframe");
iframe.src = "video.mp4"
}
<iframe src="imagename" height="200" width="300" id="iframe"></iframe>
<button onclick="a()">Play</button>
iframe does not support this by default. Why do you not want to use video tag? The only thing I can think of to make it look like an iframe without autoplay is with help of javascript.
First set the iframe src to empty or leave the src out.
Set a picture as iframe background to make it look like the video.
<iframe style="background-image:url(picture.png)" id="frame" controls="0" class="embed-responsive-item" src=""></iframe>
Then create an onclick event for that iframe and change the iframe src
function loadVideo() {
var frame = document.getElementById("frame");
frame.src = "video.mp4";
}
I would consider using video tag or a plugin that works on every browser.
According to this article the syntax should go like this:
<iframe src="https://cross-origin.com/myvideo.html" allow="autoplay; fullscreen"></iframe>
<iframe src="https://cross-origin.com/myvideo.html" allow="fullscreen"></iframe>
<iframe src="https://cross-origin.com/myvideo.html" allow=""></iframe>
This is fairly new (at least to me) and I don't see explicit directions as to how autoplay is shut off. Try either the second or third example. This is part of the new feature policy called iframe delegation which will go into full effect on april 2018. I will add onto this answer if I find more concrete info.

How to load mulitple urls into one iframe?

I have a list of urls (lets call them url1.com,url2.com,url3.com). I want to load their contents into an ifram so i can copy them. However, if i create seperate iframes for each url i cannot copy them at one. Is it possible to load multiple urls into one ifram which i can then copy. The urls only contain a string of letters and nothing else.
https://pastebin.com/mQVRPXe4
<iframe src="https://url1.com" src = name="targetframe" allowTransparency="false" scrolling="no" frameborder="0" >
</iframe>
<iframe src="https://url2.com name="targetframe" scrolling="no" frameborder="0" >
</iframe>
<iframe src="https://url3.com name="targetframe" allowTransparency="true" scrolling="no" frameborder="0" >
</iframe>
You can do a couple of things. Namely, use ajax requests or style the iframes. You can easily remove the border on the iframe with the frameBorder attribute.
I know this isn't really the best answer, and I'm not really sure what you are really trying to do here, but I was asked to put this as an answer

Open iframe in a new window

How do I open an iframe in a new window? I tried with "scrolling='auto'". It did not work.
I put my code here:
<iframe width="572px" scrolling="auto" height="335px"
frameborder="1" src="http://XXXX.com/iframe-page"
style="border: 0px none #ffffff;" name="national-campaign"
marginheight="0px" marginwidth="0px">
</iframe>
I want to open a link in a new window. I have two sites, a corporate site and a dealer site. On the corporate site, I have a page with only an image that I want to display in both corporate site and dealer site. When you click on the image, it goes to view detail page. However, what I want in my dealer site is, when you click on the iframe image, it opens the tab in a new window, instead of displaying detail page inside the iframe.
Any ideas? Cheers.
You can do it with jquery and window.open method.
HTML:
<iframe id="iframe" width="572px" scrolling="auto" height="335px"
frameborder="1" src="http://XXXX.com/iframe-page"
style="border: 0px none #ffffff;" name="national-campaign"
marginheight="0px" marginwidth="0px">
</iframe>
JS :
var iframe = $("#iframe");
var newWindow = window.open(iframe.attr(src), 'Dynamic Popup', 'height=' + iframe.height() + ', width=' + iframe.width() + 'scrollbars=auto, resizable=no, location=no, status=no');
newWindow.document.write(iframe[0].outerHTML);
newWindow.document.close();
iframe[0].outerHTML = ''; // to remove iframe in page.
The easy way is to use a hyperlink with an attribute target="_blank".
If the height and width are important to you (cf. your example), then you can use the JavaScript method window.open.
Try to add target="_top" inside that link.
or alternatively if you need to open a new page from a link inside an iframe if i understood correctly you can:
Using jQuery:
$('iframe a').attr('target', '_blank');
I would recommend that you just use a hyperlink to another page rather than an iframe. Or a screenshot image that is actually a link.
Some users may be 'smart' enough to right-click within the iframe (in internet explorer) and select a 'open in new window' option, but others wouldn't do that.

dont change iframe source when click on F5(refresh)

i have an iframe that supposed to show me the pages according to the links.
the iframe code is :
<iframe width=940px onload=reSize() src="src/HEB/registerHEB.html" id="ifrm" name="iframe_main" frameborder="0" scrolling="no"></iframe>
i want to do that when i click on link such as this one
<a href="html/guides.html" target="iframe_main">
it will open the page in the iframe, but when i click F5 (refresh) it won't load the original src of the iframe, but the last link ive clicked.
Thank you very much.
use this script after iframe same as:
<iframe src="src/HEB/registerHEB.html" id="ifrm" ......></iframe>
<script>
document.getElementById("ifrm").src = 'src/HEB/registerHEB.html';
</script>

Facebook like button create automatically

Is it possible without going to https://developers.facebook.com/tools/lint/ and putting in the URL, to rub a webservice or something and have it return the Iframe code? I do not want to go to that site manually. Thanks for any help
Just construct the URL yourself,
<iframe
src="http://www.facebook.com/plugins/like.php?href=http%3A%2F%2Fgoogle.com%2F"
scrolling="no" frameborder="0" style="height: 62px; width: 100%"
allowTransparency="true"></iframe>
and put your site's URL urlencoded behind the ?href=.
Here you go
just modify the urls array :)
http://jsfiddle.net/Tatqu/