Hello Friends Today I Am Going To Show You How To Add Animated Jquery Page Loading Effect On Blogge.Its Increase Your Blog loading Speed.So You Want To Add It.So Follow My Steps..............
- Open Your Blogger Account
- Click On Template
- Click On Edit HTML
- Now Find The Below Code (Find The Code Press CTRL + F )
</head>
- After Finding The Code Paste Below Code Before </head>
<style> /* jQuery page loading effect by www.showmedreams.blogspot.com */ #md-loading { position: fixed; z-index: 50; top: 0; left: 0; width: 100%; height: 100%; background: #FDFEF8 url(http://www.419hell.com/Kwame_Adogboba/_RefFiles/DLL.gif) no-repeat center; line-height: 350px; text-align: center; font-size: 36px; color: #353231; text-indent: -9999px; } .MD #md-loading { display: none; } @media only screen and (device-width: 768px) { #loading { position:absolute; width:1040px; min-height:768px; } } #md-progress-bar { position: absolute; top: 0; left: 0; background: #de1301; opacity: 0.8; width: 0; height: 18px; } #md-loader { height: 100%; display: none; } </style> <script> (function($){ $("html").removeClass("MD"); $("#header").ready(function(){ $("#md-progress-bar").stop().animate({ width: "25%" },1500) }); $("#footer").ready(function(){ $("#md-progress-bar").stop().animate({ width: "75%" },1500) }); $(window).load(function(){ $("#md-progress-bar").stop().animate({ width: "100%" },600,function(){ $("#md-loading").fadeOut("fast",function(){ $(this).remove(); }); }); }); })(jQuery); </script>
- NOTE: Change Red Link With Your Image Link
- After Pasting The Code Now Find The Below Code
- After Finding The Code Now Paste The Below Code After <body>
<div id='md-loading'><div id='md-progress-bar'></div><div id='md-loader'>Loading...</div></div>
- After Pasting The Code Now Save Your Template And Check Your Blog
Yipeeeeeeeeeeeeeeeeeeeeeeee..........................
Please Leave Your Question And Comment Below
Hi! Myself
This is starting only after the page has been loaded...Help me..
ReplyDeleteit's just work only in beginning
Deletenot working
ReplyDeletehttp://alllatestvideosongs.blogspot.com/
visit my site full of blogger tricks widgets and template with best ever game and software https://bishalcreations.blogspot.com
DeleteI just stumbled upon your blog and wanted to say that I have really enjoyed reading your blog posts. Any way I’ll be subscribing to your feed and I hope you post again soon.School website design uk
ReplyDeleteTen years ago I found what is remote working. It never even crossed my mind that one could work from outside of the office. And then I joined Skype family. Compared to my previous work – oh my what a different culture. A culture, a family and the product that I instantly fell in love with.
ReplyDelete