广树管理员
2025-11-21 19:57
@石樱灯笼:那就少子老龄化吧
作者:广树时间:2016-02-12 21:35:13分类:JavaScript
CSS:
.newsloader-bg {
display: none;
position: absolute;
width: 100%;
height: 100%;
top: 0px;
left: 0px;
background: #eee;
z-index: 1;
}
.newsloader {
display: none;
position: absolute;
top: 50%;
left: 50%;
width: 200px;
height: 200px;
margin-top: -100px;
margin-left: -100px;
text-align: center;
color: #999;
z-index: 2;
}
.jpnews-jp, .usanews-en {
background-color: #FFFFFF;
border-radius: 10px;
text-align: center;
vertical-align: middle;
-webkit-box-shadow: 0px 0px 6px 0px #333;
box-shadow: 0px 0px 6px 0px #333;
width: 780px;
height: 700px;
position:relative;
}
.jpnews-jp .close-x, .usanews-en .close-x {
text-align: right;
height: 35px;
padding-top: 15px;
padding-right: 15px;
z-index: 3;
position:relative;
}
HTML:
<div class="jpnews-jp"> <div class="newsloader-bg"> <div class="newsloader"> <img src="http://imgout.ph.126.net/47161134/loading.jpg" height="40" alt="Now Loading..." /> <p>努力获取中...</p> </div> </div> <div class="wrap"> <div style="width:780px;height:630px;"> 需要显示的正文内容 </div> </div> </div>
JS脚本:
<script>
$(function() {
$('.newsloader-bg ,.newsloader').css('display','block');
});
$(window).load(function () { //全部加载完后执行
$('.newsloader-bg').delay(900).fadeOut(800);
$('.newsloader').delay(600).fadeOut(300);
$('.wrap').css('display', 'block');
});
//经过一定时间后如果还未加载完则强制显示内容
$(function(){
setTimeout('stopload()',240000);/*设置时间*/
});
function stopload(){
$('.wrap').css('display','block');
$('.newsloader-bg').delay(900).fadeOut(800);
$('.newsloader').delay(600).fadeOut(300);
}
</script>











