Geek Answers Handbook

JQuery body fade-in

I was wondering how to create a body that fades when the page is refreshing? You can see an example - saporiexports.com . And how much does this kind of jQuery affect page performance?

The only thing I found on this page would probably be related to this effect.

//PRELOAD SITE $(window).load(function(){ $('#preloader').fadeOut('slow',function(){$(this).remove();}); });

and than a div in HTML <div id="preloader"></div> , but I think this is some kind of reloader. But this page is not necessary (maybe I'm wrong).

Of course you can do something like this -

 $(function() { $('body').hide().fadeIn('slow'); });

And it works, but I don’t think this is the right way to do it.

EDIT Now I see that they use an overlay div to control this effect

 div#preloader { background: url("../workimage/ajax-loader.gif") no-repeat scroll center center #000000; height: 100%; position: fixed; width: 100%; z-index: 999; }
+4
source share
2 answers

What this website has done is overlay the entire page and fade it out. I don’t think it matters a lot, you can check both approaches to see which is faster

+3
source

This seems to be a good way to create this effect. This does not affect performance. He just hides the body, and then shows it again. Just one easy process.

Greetz,

XpertEase

0
source

More articles:


All Articles