I've needed this and after some research on the internet I came up with this (jQuery needed):(我需要这个,经过互联网上的一些研究后我想出了这个(需要jQuery):)
First right after the body tag add this:(首先在body标签后添加:)
<div id="loading">
<img id="loading-image" src="images/ajax-loader.gif" alt="Loading..." />
</div>
Then add the style class for the div and image to your CSS:(然后将div和image的样式类添加到CSS:)
#loading {
width: 100%;
height: 100%;
top: 0;
left: 0;
position: fixed;
display: block;
opacity: 0.7;
background-color: #fff;
z-index: 99;
text-align: center;
}
#loading-image {
position: absolute;
top: 100px;
left: 240px;
z-index: 100;
}
And finally add this javascript to your page (preferably at the end of your page, before closing <body>
tag of course):(最后将这个javascript添加到您的页面(最好在页面的末尾,然后在关闭<body>
标签之前):)
<script language="javascript" type="text/javascript">
$(window).load(function() {
$('#loading').hide();
});
</script>
Then adjust the position of the loading image and the background colour of the loading div with the help style class.(然后使用帮助样式类调整加载图像的位置和加载div的背景颜色。)
This is it, works just fine.(这就是它,工作得很好。)
But of course you have to have an ajax-loader.gif
somewhere.(但是当然你必须在某个地方有一个ajax-loader.gif
。) 与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…