JqueryEasyUI 解决IE下加载时页面错乱的问题

问题描述：

一直觉得jqueryeasyui在IE下的渲染效果不大好，尤其刚进入页面时的加载，页面会出现布局错乱，虽然是一闪而过，但是给用户的体验不好；

可以通过在页面onload时，增加一个遮罩层，把jqueryeasyui的页面渲染过程遮住，等页面加载完后，扔掉遮罩层，显示页面；

解决办法：

[javascript] view plain copy

print?

1. /* 
2. 文件说明：页面加载时Loading JS 
3. 文件描述：解决IE或FF下，初始化加载时，页面布局乱掉的问题，参考：http://283433775./blog/720895 
4. */  
5. var width = $(window).width();  
6. var height = $(window).height();  
7.   
8. var html = "<div id='loading' style='position:absolute;left:0;width:100%;height:" + height + "px;top:0;background:#E0ECFF;opacity:1;filter:alpha(opacity=100);'>";  
9. html += "<div style='position:absolute;cursor1:wait;left:" + ((width / 2) - 75) + "px;top:200px;width:150px;height:16px;padding:12px 5px 10px 30px;";  
10. html += "background:#fff url(" + _basepath + "Scripts/jquery-easyui-1.4/themes/default/images/loading.gif) no-repeat scroll 5px 10px;border:2px solid #ccc;color:#000;'>";  
11. html += "正在加载，请等待...";  
12. html += "</div>";  
13. html += "</div>";  
14.   
15. window.onload = function () {  
16.     var mask = document.getElementById('loading');  
17.     mask.parentNode.removeChild(mask);  
18. };  
19. document.write(html);  
20.    

把上面的js保存到文件，再引用到页面即可。