A Responsive Blogger Website, That Take my blog to the next level.

I am a Software Developer, Learning and experementing with .Net Technology and try to put my Learning altogether here.


We have all sections related to .Net Technology, like .Net-C#, Asp.Net, MVC, jQuery, AngularJs, Sharepoint. Find out more...


Following are the some of the Advantages of using this Web site :-

  • Get Update about latest in .Net world.
  • Collection of Useful, Frequently used .Net Solutions.
  • It’s beautiful on every screen size (try resizing your browser!)
by

Animated Page Loading Effect for Blogger


Via Web page

Loading Effect Blogger
Every blogger wants his blog to look best among his competitors blogs. This widget will add a bit more chunks of awesomeness in your blog.

The concept of this widget is simple. This is more or less like Exit Effect we add in Microsoft Powerpoint's Custom Animation. Just like that whenever the visitors will click any link to leave the current page, inspite of the old boring loading it will have animation.

A live demo can be seen on my blog itself. Just click any link here and you could see the change.

To add this effect to your blog do the following things.

Adding the HTML and Script

Add the below given code just above </body>.
<style>
#abt-page-loader {
        position: fixed!important;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        z-index: 9999;
        background:#000 url('http://3.bp.blogspot.com/-sW166HTPK4U/UY2kVNdjsFI/AAAAAAAAEHk/fIO-B-mOeCE/s200/load6.gif') no-repeat 50% 30%;
        color: #FFF;
        display: none;
        font: 0/0 a;
        text-shadow: none;
        padding: 1em 1.2em;
}
</style>
<script type='text/javascript'>
//<![CDATA[
$(document.body).append('<div id="abt-page-loader">Loading...</div>');
$(window).on("beforeunload", function() {
    // ... Show the Animation `.fadeIn()`
    $('#abt-page-loader').fadeIn(1000).delay(6000).fadeOut(1000);
});
//]]>
</script>

After adding this code, save the template.
You are done now. Now you and your visitors can see this awesome and cool Animated Page Loading Effect in you blogger blog.

Inoreader is a light and fast RSS Reader. Follow us on Twitter and Facebook.

0 comments :