页面载入中的功能如何写
日期：2014-05-16 浏览次数：20420 次
页面载入中的功能怎么写？
由于页面打开的时间过长，想写个页面载入中的功能，有没有好一点的例子？
------解决方案--------------------
可以将要打开的页面 放到 iframe 中，等iframe加载完毕再显示出来。
老虎传送门
------解决方案--------------------
楼上用iframe效果我感觉应该是可以实现的，但是我觉得跟LZ说的页面打开的时间过长，可能时间更长，时间过长可能的情况有很多，其一就是加载的功能或者是数据过多造成的，我也解决不了
提供两个页面加载的方法
------解决方案--------------------
老虎的方式+1，注意iframe开始要隐藏起来，并且在开始页面实现一个加载中的图标。
------解决方案--------------------
添加个JS进度条
------解决方案--------------------
你的页面是用的什么？ajax、structs标签、javabeen，依情况而定、、
------解决方案--------------------
用ajax吧 请求开始 loading
------解决方案--------------------
要提供页面的详细信息 把网址放出来
不同情况处理和优化不一样
------解决方案--------------------
所有内容放到一个总容器中，容器隐藏，window.onload中显示容器信息就行了
------解决方案--------------------
很多人都回复的挺好,但我认为缺少点睛之笔把这个事情说的透彻的. Extjs文档页面就有loading效果,楼主可以查看一下它的源码,然后在对照我下面的剖析.
要做到简单的loading效果,页面的代码结构应该是这样的:
<!doctype html>
<html>
<head>
<title>The title</title>
<显示loading效果必须的css,用来设置loading图标的样式和蒙版层样式, 它要小而精悍, 加载速度要足够快, />
</head>
<body onload="把蒙板层和loading图标层干掉">
<div><img src="loading.gif" />这里是loading图标层, loading图标的体积要足够小, 加载速度要足够快</div>
<div class="mask">这是一个蒙板层, 蒙板层的作用就是把真正的body部分先蒙住,等全加载之后再显示,蒙板层做法很简单, position=absolute, left=0, top=0, height='full height', width='full width', z-index比图表层的小1</div>
<div>
下面就是你的需要长时间加载的主体内容了.
</div>
</body>
</html>
上面的做法有时候会产生一个小问题: 就是页面主体内容过长的话,会产生滚动条,滚动一下就又可以看到主体内容了, 解决这个问题也不难, 刚开始的时候把body的overflow设置为hidden, 最后在onload里面还原回来.
------解决方案--------------------
extjs文档例子:http://dev.sencha.com/deploy/ext-2.3.0/docs/
------解决方案--------------------
由于页面打开的时间过长，想写个页面载入中的功能，有没有好一点的例子？
------解决方案--------------------
可以将要打开的页面 放到 iframe 中，等iframe加载完毕再显示出来。
老虎传送门
------解决方案--------------------
楼上用iframe效果我感觉应该是可以实现的，但是我觉得跟LZ说的页面打开的时间过长，可能时间更长，时间过长可能的情况有很多，其一就是加载的功能或者是数据过多造成的，我也解决不了
提供两个页面加载的方法
//页面加载
$(function () {
//加载内容
});
或者
function test(){
//功能
}
window.onload = test;
------解决方案--------------------
老虎的方式+1，注意iframe开始要隐藏起来，并且在开始页面实现一个加载中的图标。
------解决方案--------------------
添加个JS进度条
------解决方案--------------------
你的页面是用的什么？ajax、structs标签、javabeen，依情况而定、、
------解决方案--------------------
用ajax吧 请求开始 loading
------解决方案--------------------
要提供页面的详细信息 把网址放出来
不同情况处理和优化不一样
------解决方案--------------------
所有内容放到一个总容器中，容器隐藏，window.onload中显示容器信息就行了
<div id="loading">正在努力加载中...</div>
<div id="dvContainer" style="display:none">
所有的内容放到这里来
<img src="http://www.coding123.net/imgdesign/20120928/20120928164213345.jpg"/>
</div>
<script>
window.onload=function(){
document.getElementById('loading').style.display='none'
document.getElementById('dvContainer').style.display='block'
}
</script>
------解决方案--------------------
很多人都回复的挺好,但我认为缺少点睛之笔把这个事情说的透彻的. Extjs文档页面就有loading效果,楼主可以查看一下它的源码,然后在对照我下面的剖析.
要做到简单的loading效果,页面的代码结构应该是这样的:
<!doctype html>
<html>
<head>
<title>The title</title>
<显示loading效果必须的css,用来设置loading图标的样式和蒙版层样式, 它要小而精悍, 加载速度要足够快, />
</head>
<body onload="把蒙板层和loading图标层干掉">
<div><img src="loading.gif" />这里是loading图标层, loading图标的体积要足够小, 加载速度要足够快</div>
<div class="mask">这是一个蒙板层, 蒙板层的作用就是把真正的body部分先蒙住,等全加载之后再显示,蒙板层做法很简单, position=absolute, left=0, top=0, height='full height', width='full width', z-index比图表层的小1</div>
<div>
下面就是你的需要长时间加载的主体内容了.
</div>
</body>
</html>
上面的做法有时候会产生一个小问题: 就是页面主体内容过长的话,会产生滚动条,滚动一下就又可以看到主体内容了, 解决这个问题也不难, 刚开始的时候把body的overflow设置为hidden, 最后在onload里面还原回来.
------解决方案--------------------
extjs文档例子:http://dev.sencha.com/deploy/ext-2.3.0/docs/
------解决方案--------------------
<body>
<script type="text/javascript">
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
