Links in embedded html - html

I have some HTML code I'm trying to embed into a site.
The code is an iframe that is supposed to have a bunch of links in it, but when I click the links, they just load the page inside the iframe block.
Here is the code:
base.html
<head height="200" width="300">
Text
</head>
<div>
<body>
<iframe height="200" width="300" src="test.html"></iframe>
</body>
</div>
test.html
<head>
Link
</head>
Is there a way for me to tell the link NOT to load inside the frame?
I already know of a workaround which is to add "target="_blank"" to the link so it opens in a new tab.

Try adding the target attribute as shown below
Link
the tag _parent will target the iframe's immediate parent window.
the tag _top will target the top window.

Try adding target="_top" this should target the parent URL instead of the iframe URL
<head>
<a target="_top" href="file:///Users/Jean/base.html">Link</a>
</head>

Related

Why doesn't the src attribute of an iframe change if I click on any link inside it?

In the following code the src attribute of iframe always shows b.html in devtools insepct, even after clicking on the link in the b.html page
index.html
<html>
<body>
<iframe src="b.html">
</iframe>
</body>
</html>
b.html
<html>
<body>
link
</body>
</html>
d.html
<html>
</html>
The spec doesn't appear to explain why this is the case, other than by stating that the WindowProxy operates independently of the element itself (for what it's worth). It does confirm that this is expected behavior (W3C HTML5, WHATWG HTML):
If the user navigates away from this page, the iframe’s corresponding WindowProxy object will proxy new Window objects for new Document objects, but the src attribute will not change.
As #BoltClock said, the src= attribute of the iframe doesn't change but you can get the new url of the iframe by accessing its
document.getElementById('my-iframe').contentWindow.location.href
but your iframe has to be on the same domain as the page hosting it.

Detect iframe link click and open it as main window

I have two page index.html and my.html
the my.html will appear as iframe in index.html
and in my.html will a link, if any one click the link http://www.swisteronline.in need to open. I do it, but the page http://www.swisteronline.in is opening in iframe in place of my.hml. but i need to open the site in place of index.html what to do?
index.html
<html>
<head>
<title>Index</title>
</head>
<body>
<iframe src="my.html" height="100%" width="100%" scrolling="no" frameborder="0">`</iframe>`
</body>
</html>
my.html
<html>
<body>
Click here to go
</body>
I need to open http://www.swisteronline.in when anyone clicke on "Click here to go" in place of index.html. I can only open it in place of my.html
what to do? please help... thanks
Add target="_parent" in anchor tag inside my.html
Click here to go

Link inside iframe wont work

This drives me totally crazy now. A link (http://ns.nl) on the page inside the iframe I made wont work (http://newsoundsofeurope.com/videos/playlisttest). Chrome doesn't do anything after the mouse click. Firefox just opens a blank page inside the iframe. Anyone can help?
Page with iframe:
<html>
<head>
</head>
<body>
<iframe src="playlist_iframe.php"></iframe>
</body>
</html>
Page inside iframe:
<html>
<head>
</head>
<body>
<img src="026.png"/>
</body>
</html>
Remove target="_self and will work.
If you want to open that link with a new page, you need to set the target="_blank"
<img src="026.png"/>
Also need to set the 'allow-popups' permission in the iframe
<iframe src="playlist_iframe.php" sandbox="allow-popups"></iframe>
https://www.w3schools.com/tags/att_iframe_sandbox.asp

How to change iframe pages without the parent page changing with external links using CSS

I'm working on a webpage where I need to be able to click on buttons that change iframes with in a parent page. I thought this would be a simple task but no matter what I do, the button keeps opening a new window rather than opening the page inside the iframe. The page looks perfect and the iframe loads up but when I click the button in the parent window to change the page it opens in a new tab. Here is the complete code I'm using (minus the changed webpage names) if someone could point out what I'm doing wrong please.
<head>
<style>
body
{
background-image:url(bg4.jpg);
background-repeat:no-repeat;
background-attachment:fixed;
background-position:top;
background-size:100%;
}
p.pos_fixed
{
position:fixed;
top:98px;
right:298px;
}
</style>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Stupid webpage that dont work</title>
</head>
<body>
<p class="pos_fixed">
<iframe id="MSL" src="http://www.yahoo.com" width="975" height="800">
</iframe>
<center>
<a href="http://www.google.com" target="MSL">
<img src="MSL.jpg" alt="MSL" width="42" height="42"></a>
</center>
</p>
</body>
</html>
In order for your link to target the iframe, you must add the "name" attribute to such frame, nothing to do with "id"
<iframe id="MSL" name="MSL" src="http://www.yahoo.com" width="975" height="800">
</iframe>
Also, your DOM structure is very bad, you should not nest iFrames inside paragraphs. In short, the target attribute in anchor elements need to match the name attribute in the iFrame unless it is a reserved one such as "_blank", "_self", "_parent", or "_top".

How to open only some links in a iframe on the parent window

i have an iframe on a page which opens a calendar application, in this application, I have some links that are of the app itself, while some other links should open in the parent window.
using: <base target="_parent" /> makes all the links opens in the parent window, but i would like only some kind of links to target the parent window, not all...
is it possible to have a crossbrowser solution?
It seems you don't really need the <base> tag. You could just use the the target attribute on those links (<a>) you want to behave differently.
If you still want to use <base>, the target will be the one specified by <base> for those links without the target attribute.
For instance:
<base target="_self"></base>
Open SO in parent window/tab
<br/>
<a href="http://stackoverflow.com" >Open SO in this window/tab</a>
jsFiddle
Can't you just add a target parameter to a link you want to open in the parent frame? like <a href="bla.html" target="_parent" />
With that snippet you open the link in the parent
<base target="_parent" />
<a target="_parent">your link open in the parent</a>
With that snippet you open the link in the iframe itself
<base target="_blank" />
<!-- that should even work without the bank -->
<a target="_blank">your link open in the iframe</a>
this is supported in all browsers