How To Preload A Web Page Using External Preloader?

I have a simple HTML page that has a large image as a full screen background; I called this page index2.html. I want to create another page called index.html which will preload ind

Solution 1:

You can cause the browser to cache the image by loading it on index.html as a 1 pixel image

<imgsrc="/index2-background-image.jpg"alt=""width="1"height="1" />

Alternatively you could load the content from index2.html using jQuery like so:

<scriptsrc="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script><scripttype="text/javascript">jQuery().ready(function () {
    $.get('index2.html', function(data) {
        jQuery("#index2content").html(data);
    });
});
</script><divid="index2content"></div>