Question

I have a WebApp in HTML5.

Here is the link

I wanted to load the whole webpage asynchronously. Like when the webpage is accessed I want to show the user a loading image and the page is loaded completely in async mode in the background. I tried to load the scripts async but it doesnt much affect its behavior.

Is there a way this is possible !

Answer 1

Try using the same method as Tobias Krogh suggested.

But rather than putting the contents in the #main by using plain old JS

document.body.innerHTML = request.responseText;

Use Jquery to put the contents in the body using .html()

$("body").html(request.responseText);

Edit:
And load the CSS & JS using a JS loader.
Possible Lazyload or YepNope, to load them asynchronously.
That should do the Job !