Jquery是一个功能强大的易用的JavaScript库，在jquery中页面或内容正在加载的效果是很容易实现的。以下是一个使得你web 页面内容呈现一个加载的效果的例子。它会给你的读者留下深刻的印象。
它是一个很简单的想法。
1 创建一个div 隐藏块
这个div 块被用来实现内容渐进显示的页面加载的效果。
<divid="page_effect"style="display:none;">
<!-- this content is hide, need jQuery to fade in -->
</div>
2 jquery 逐渐消失的效果
创建一个jquery渐进的效果当文档准备展示时。
$(document).ready(function(){
$('#page_effect').fadeIn(2000);
});
其中fadeIn() 是jquery内建的函数。
3 实例
完整的例子实现了逐渐加载的例子
<html>
<head>
<title>JQuery Page Loading Effect</title>
<scripttype="text/javascript"src="jquery.js"></script>
</head>
<scripttype="text/javascript">
$(document).ready(function(){
$('#page_effect').fadeIn(2000);
});
</script>
<body>
<divid="page_effect"style="display:none;">
<h1>JQuery Page Loading Effect</h1>
This is page loading effect with JQuery 1<BR>
This is page loading effect with JQuery 2<BR>
This is page loading effect with JQuery 3<BR>
This is page loading effect with JQuery 4<BR>
This is page loading effect with JQuery 5<BR>
This is page loading effect with JQuery 6<BR>
This is page loading effect with JQuery 7<BR>
This is page loading effect with JQuery 8<BR>
This is page loading effect with JQuery 9<BR>
This is page loading effect with JQuery 10<BR>
This is page loading effect with JQuery 11<BR>
This is page loading effect with JQuery 12<BR>
This is page loading effect with JQuery 13<BR>
This is page loading effect with JQuery 14<BR>
</div>
</body>
</html>
效果：
开始效果
最后效果：
2349
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
