0
How to create a p reloader?
Please anyone send me preloader, the logo should come first and after name should come that should go and fix on the top. Please help me.
2 Respuestas
+ 1
1. Add a div just after <body> tag.
<div class="se-pre-con"></div>
2. Add some CSS to show the icon and bring it in the middle of the page.
/* Paste this css to your style sheet file or under head tag */ /* This only works with JavaScript, if it's not present, don't show loader */ .no-js #loader { display: none; } .js #loader { display: block; position: absolute; left: 100px; top: 0; } .se-pre-con { position: fixed; left: 0px; top: 0px; width: 100%; height: 100%; z-index: 9999; background: url(images/loader-64x/Preloader_2.gif) center no-repeat #fff; }
3. Now add some jQuery to show the pre-loading icon when the page is loading and hide when it has finished loading.
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script> <script src="http://cdnjs.cloudflare.com/ajax/libs/modernizr/2.8.2/modernizr.js"></script>
//paste this code under the head tag or in a separate js file.
// Wait for window load
$(window).load(function() { // Animate loader off screen $(".se-pre-con").fadeOut("slow");; });
All done, now reload your page and it will show a loading icon.
0
Thank you sir....