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
Deletevisit my site full of blogger tricks widgets and template with best ever game and software https://bishalcreations.blogspot.com
ReplyDeleteI 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