问题描述:
一直觉得jqueryeasyui在IE下的渲染效果不大好,尤其刚进入页面时的加载,页面会出现布局错乱,虽然是一闪而过,但是给用户的体验不好;
可以通过在页面onload时,增加一个遮罩层,把jqueryeasyui的页面渲染过程遮住,等页面加载完后,扔掉遮罩层,显示页面;
解决办法:
/* 文件说明:页面加载时Loading JS 文件描述:解决IE或FF下,初始化加载时,页面布局乱掉的问题,参考:http://283433775.iteye.com/blog/720895 */ var width = $(window).width(); var height = $(window).height(); 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);'>"; html += "<div style='position:absolute;cursor1:wait;left:" + ((width / 2) - 75) + "px;top:200px;width:150px;height:16px;padding:12px 5px 10px 30px;"; 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;'>"; html += "正在加载,请等待..."; html += "</div>"; html += "</div>"; window.onload = function () { var mask = document.getElementById('loading'); mask.parentNode.removeChild(mask); }; document.write(html);把上面的js保存到文件,再引用到页面即可。