alternatives to frames to include content from different servers

I need to make a series of webpages. Each with a header coming from a website, and the content coming from an html page in my dropbox/public. I simple way would be to use frames, but they are deprecated.

As the html content is o开发者_高级运维f different size. So the iFrame does not seem to be the right tool.

What alternatives do I have?

Many people seemed to suggest in the comments ajax with jsonp. Unfortunately I am completely new to those methods, so I would need an example to copy and then work with.

Thanks, Pietro

---

You need to have the Jquery library in the main page. Copy the above code on the header of your page:

<script src="http://code.jquery.com/jquery-1.7.1.min.js" type="text/javascript"></script>

The make a div with the response id:

<div id="response"></div>

JQuery has an AJAX function called "load", this function is appended to a selector where you want a page to be loaded, in this case we want to contents of file "exemple.html" to load in the tag with id "response".

<script>

$(document).ready(function(){
    // load exemple page when the page loads
    $("#response").load("exemple.html");
});

</script>

Also you can load the content when a link from the main page is clicked:

<script>

$("#exemple").click(function(){
    // load exemple page on click
        $("#response").load("exemple.html");
    });

</script>

For this you have to add on your HTML code a link with the id="exemple"

<a href="#" id="exemple">Click to load the exemple page</a>

Hope this helps you!