How can I preload HTML content to an invisible div

[m2244]

Hello,

I have what I call a hub page which loads only once. Then I use JS/jQuery (I know, same thing) to load the html content to a div. When the user clicks the next button new content is displayed.

So, I am wondering how I would go about preloading the html content for the next page to an invisible or "off the screen" div. Then when the user clicks the 'next' button, the preloaded content would be loaded to the active div and the invisible div would preload the next page, and so on.

This sounds a bit easier now that I have thought it through.

Any advice here?

[WolfShade]

JS/jQuery are not the same. jQuery is a library that runs under JS.

Yeah, you can load as many hidden divs as you like, all preloaded with content, then use buttons to "paste" the HTML content of any hidden div into the visible div. If you're using jQuery, the .html() will do it.

[xelawho]

... or just hide() and show() divs as required

[rnd me]

it would be better to store it in a var instead of as a hidden dom element. The more stuff in the dom, the slower the page renders and scrolls...