Logan
Logan

Reputation: 95

How can I get an iframe to load the whole page into the next page?

How can I get an iframe to load the whole page into the next page?

I am a N00b html coder and i was wondering

<center>
<a href="www.google.com">Home</a>
<hr>

and loaded it into an iframe, and click on it, it loads inside of the iframe. I want it to load on the entire page.

Upvotes: 1

Views: 2639

Answers (3)

416E64726577
416E64726577

Reputation: 2214

If I understand you correctly, you want an iframe on a page, but when the iframe is clicked on, you want the page in the iframe to open in a new tab. This is what I did to do this:

<!DOCTYPE html>
<html>
    <head>
        <style>
        div.iframe-link {
        position: relative;
        float: left;
        width: 730px;
        height: 330px;
        margin: 0 1em 1em 0;
        }
        a.iframe-link {
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        }
    </style>
</head>
<body>
    <div class="iframe-link">
    <iframe src="http://en.wikipedia.org" width="750" height="350">
    Your browser does not support iframes.
    </iframe>
    <a href="http://en.wikipedia.org" target="_blank" class="iframe-link"></a>
    </div>
</body>
</html>

In this iframe, you can still use the scrollbars, but you cannot do anything in the iframe without going to that page. Change the width and the height in div.iframe-link to change the size of the hyperlink part of the iframe. My example has Wikipedia instead of Google.

:)

Also, if you do not want the iframe link to open in a new tab, just change

<a href="http://en.wikipedia.org" target="_blank" class="iframe-link"></a>

to

<a href="http://en.wikipedia.org" target="_self" class="iframe-link"></a>

Upvotes: 3

Daniel Perv&#225;n
Daniel Perv&#225;n

Reputation: 1716

If I understand it correctly, you want to be able to click on a link inside an iframe and open it in the entire window?

In that case you will need to specify a target on your link, as such:

<a href="www.google.com" target="_top">Home</a>

This will make sure that the top frame (i.e. the window) follows the link.

Upvotes: 3

MrShemek
MrShemek

Reputation: 13

Try this. For me it works

<iframe src="http://www.google.com"></iframe>

Upvotes: 0

Related Questions