LOADING SCREEN: FADE OUT LOADING SITE

How to make a fade out loading site? This loading will have effect fade out when visitor clicked on link. The fade out effect will show only on index page and homepage. It's pretty neat, try it out! Or you can check many more different style for customise your site's loading screen like Nanobar's bar progress.

LOADING SCREEN: FADE OUT LOADING SITE

Tutorial How to make a website loading effect:

1. Open Blogger > Template > Edit HTML.
2. Add this script before </body> tag.

<b:if cond='data:blog.pageType != &quot;item&quot;'>
<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<script type='text/javascript'>
//<![CDATA[
// Fade Out Effect
$(document).ready(function(){function n(){window.location=linkLocation}$("body").css("z-index","-10"),$("body").fadeIn(5e3),$("a").click(function(o){o.preventDefault(),linkLocation=this.href,$("body").fadeOut(1e3,n)})});
//]]>
</script>
</b:if>
</b:if>

3. Save your template and see the result.

Tag: How to make a fade out animation loading effect on site or for blogger, Cara membuat loading untuk blog, bagaimana cara membuat loading pada situs, how to customize blogger with nice tricks and tips.