How to make a html page to show content from anoth

Question

I want to make a html page that act kind like google cache.

Say in my homepage HOME, I have a link A to a website B, and when I click on A, the page that comes out will display the content of another page, with a floating bar on top that has some functions of my own choices.

For example, I want my link to show google.com, but I also want to add a button(floating bar, anything) to that google.com that allows me to return to my own webpage when pressed.

Can someone provide me some useful resources for me too look at, or even better a solution template? :)

Thanks!

Answer 1

You could use an <iframe> in order to display an external webpage within your webpage. Just place the url of the webpage that you want to display inside the quotes of the src attribute.

<iframe src="http://www.webpage.com" width="400" height="400"></iframe>

Answer 2

An iframe sounds like it may be what you need, but I'm not 100% sure after reading your description. The iframe will show content from another URL in your page. Once you have that all you need to do is style the page and use CSS/JavaScript to add in your functionality as described.

Check out this: http://www.w3schools.com/tags/tag_iframe.asp

Answer 3

Either you use an iframe or you load the site via AJAX into a div (e.g. using jQuerys load() method).

Answer 4

Here's the general idea:

HTML:

<a href="#" id="link">Click Here</a>
<iframe id="frame" src="http://www.w3schools.com" scrolling="yes"></iframe>

Some jQuery (not tested):

$(document).ready(function() {
    $('#frame').hide();

    $('#link').click(function () {
        $('#frame').show();
    })
})

Style it as necessary

Note - this answer in no way endorses w3schools.com :-) . Please see w3fools.com/