Posted August 8th 2013, 9:52 pm
Hello! I am going to provide a code of loading page with effect. When the page is refreshing, a loading image will pop-out, and once the page is loaded, the loading image will disappear by fade.
Forum Version: All version
So let's start! :D
For PunBB and Phpbb2:
1. Go to overall_header template, find the ending head tag (</head>) then paste this before the closing tag:
1. Add this to your Javascript Management: (In all pages)
Forum Version: All version
So let's start! :D
For PunBB and Phpbb2:
1. Go to overall_header template, find the ending head tag (</head>) then paste this before the closing tag:
- Code:
<script>
jQuery(window).load(function(){
jQuery('#loading').fadeOut(2000);
});
</script>
- Code:
<div id="loading"></div>
- Code:
#loading {
background: #000 url(http://i41.tinypic.com/j92cy8.gif) no-repeat center center;
height: 50px;
width: 50px;
position: fixed;
left: 50%;
top: 50%;
margin: -25px 0 0 -25px;
z-index: 1000;
border-radius: 5px;
}
1. Add this to your Javascript Management: (In all pages)
- Code:
jQuery(window).load(function(){
jQuery('#loading').fadeOut(2000);
});
- Code:
<div id="loading"></div>
- Code:
#loading {
background: #000 url(http://i41.tinypic.com/j92cy8.gif) no-repeat center center;
height: 50px;
width: 50px;
position: fixed;
left: 50%;
top: 50%;
margin: -25px 0 0 -25px;
z-index: 1000;
border-radius: 5px;
}
Last edited by Mark on August 8th 2013, 10:06 pm; edited 1 time in total