I have an iframe where the web page inside of the iframe runs a JavaScript redirect to a new page. On most browsers, the iframe is redirected to the new page. On Chrome however this script acts as a "frame breaker" and the entire page gets redirected. How do I make chrome act like the other browsers?
To Reproduce this effect on your machine:
Open this page: http://www.w3schools.com/html/tryit.asp?filename=tryhtml_iframe_height_width
Then replace the iframe source with this page:
src="http://www.tizag.com/javascriptT/examples/timedelay.php"
Chrome supports the sandbox attribute which you can use to prevent the loaded page from breaking out of your iframe.
If you add sandbox="allow-scripts" to the iframe in your example it works on Chrome.
You could get the link of the redirect page and put it in. For example, if www.go.ogle.com/1gsth7uh redircted you to armorgames.com, just put in armorgames.com instead of www.go.ogle.com/1gsth7uh.
You could do this instead of whatever you use for the method:
<button onclick ="javascript:ShowHide('iframe')" href="javascript:;" >Show/Hide Iframe</button>
<iframe id="iframe" scr="https://secure.translations.com/ProjectA" style="DISPLAY: none" />
<script language="JavaScript">
function ShowHide(divId)
{
if(document.getElementById(divId).style.display == 'none')
{
document.getElementById(divId).style.display='block';
}
else
{
document.getElementById(divId).style.display = 'none';
}
}
</script>
Related
Whenever I try to open a URL with window.open(), no window is opened. So I tried this
<input
id="googleLink"
onclick="window.open('https://www.google.com', '_blank');"
style="display: none"
>
And I tried to click it with Typescript
this.googleLink = document.getElementById("googleLink") as HTMLElement;
this.googleLink.click();
And read this
window.open(url, '_blank'); not working on iMac/Safari
But none of it helps. I am not running my code in an async function. What can I do? I have an iPhone 11 and 7 and on both, it does not work. It works just fine on android and pc. I need the URL to be opened in a new window.
I need to do this with the onClick since I am using pixi js and it is a pixi container that is being clicked.
Setting the href won't help either because I want the page to open in a new tab.
This should work on safari as well, but you can add a target to the link by adding target="_blank". This opens the link in a new tab and should also open in a new window on safari. Here is an example:
Link text.
In your case wrap the input in a link:
<input
id="googleLink"
style="display: none"
>
If you dont want to do this with html and instead an onclick function, you could also use the onclick="location.href='https://example.com'"
You can try the below
<canvas id="myCanvas" width="200" height="100" style="border: 1px solid #000;" onclick="myFunction('thisURL')"></canvas>
<script>
function myFunction(url) {
window.open(url, '_blank').focus();
}
</script>
Have you checked if you have Block pop-up windows disabled in Safari Security settings? The same thing applies to mobile versions of Safari.
Try to replace async with a defer attribute in your script.
I would like to drag&drop text from iframe to input on OSX, but it doesn't work.
<input />
<iframe
src="https://react-hooks.org/"
title="inline browser"
></iframe>
<span>adasdasas</span>
Apparently it's a CORS issue, see this code:
<input />
<iframe
src="https://react-hooks.org/"
title="inline browser"
></iframe>
<iframe id="myframe"></iframe>
<script>
var ifrm = document.getElementById('myframe');
ifrm = ifrm.contentWindow || ifrm.contentDocument.document || ifrm.contentDocument;
ifrm.document.open();
ifrm.document.write('Hello World!');
ifrm.document.close();
</script>
<span>adasdasas</span>
https://jsfiddle.net/4Lqjvc6p/
In my tests, I had no difficulty while dragging and dropping from #myframe into the input, since it's using the same origin, while doing the same from your iframe, that has a different origin proved to be impossible. You could make your server act as a proxy to work around the issue, that is, request to the target on server-side and output the content as the content of an iframe. That should work, but you will have difficulty with coping the js, css and img content of the original.
I have a iframe in my web page of a video from another site but when i click play or anywhere in the iframe space it opens a link to the site with the video of it.
I'm trying to make a site for playing series and i want to use iframe to show the video from another site rather than downloading it.
I've tried everything but i viewed the other sites source code and it seems it has some java code i suppose that's causing the issue preventing the iframe from working.
http://entervideo.net/watch/94c96f7dc0bd33c
that's the link above, could you kindly inspect the source code first.
This is the code that I tried:
<iframe style ="display:block; margin: 0 auto;" width="1238" height="696"
allowfullscreen="" webkitallowfullscreen="" mozallowfullscreen=""
frameborder="0" src="http://entervideo.net/watch/94c96f7dc0bd33c"
scrolling="no" target="_self"></iframe>
(Down below is the java script code from the link and I think it's causing the problem)
<script>
function inIframe () {
try {
return window.self !== window.top;
} catch (e) {
return true;
}
}
console.log(document.referrer);
console.log(inIframe());
//if(!document.referrer&&inIframe()) document.write('<a
href="http://entervideo.net/watch/94c96f7dc0bd33c" target="_blank"
style="position:fixed; display:block; height:100%; width:100%; z-index:99999;
top: 0;left: 0; background: rgba(255, 255, 255, 0.1);color:#fff;font-
size:30px;">Please remove sandbox tags on the iframe.</a>');
if(document.referrer||!inIframe()){
var element = document.getElementById("ptc");
element.parentNode.removeChild(element);
console.log('deleting');
}
</script>
i want it to play the video on my web page when i click on the play button on the control rather than it opening the link to the other site.
Replace target="_blank" with target="_self" in JavaScript.
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.
I have an iframe:
For ex.
Now when a link is clicked in this frame i want my whole page to go that page and not just that frame.
How do i do it ?
Thanks
There are two options:
1st option: If you can edit the page in the frame, set all the links in that page to
target="_top"
So it should be like this
EXAMPLE.HTML
This is an example website.
This is an example <a target="_top" href="http://www.google.com">link</a>
And then the main webpage where you have the iframe.
<iframe src="example.html"></iframe>
and that should work fine.
Another way is to set all the links automatically using Javascript. This only works if the page you are loading is in the same domain as the main page.
<script language="Javascript">
function changeLinks(targ)
{
var links=targ.contentDocument.getElementsByTagName("a");
for(var i=0;i<links.length;i++)
{
links[i].target="_top";
}
}
Set the "target" attribute of the hyperlink to "_top".
Do you have control over where the links go in the content of the iframe?
if so, you can target="_parent" in the link in the iframe.