Question

Are there any tutorials or plugins for fading a site into view once its loaded properly, to limit any jarring etc, so the content appears smoothly basically?

I suppose it would be easier if it was just a specific area, as a header or footer will already be cached, from previous pages…

For example a portfolio page with various thumbnails, they only appear smoothly when ready.

Can this be done?

Thank you for any help 🙂

Answer 1

Yes, wrap your content with a div (e.g. <div id="main-content">) and in your css put this:

div#main-content { display: none; }

Then use this script.

$(document).ready(function() {
    $('#main-content').fadeIn();
});