等待页面的css样式加载完毕,Html内容加载完毕,样式生成后再进行展示,避免一开始加载内容后,逐渐渲染样式造成的不良视觉效果,增强用户体验。
61 ? (_PageHeight - 61) / 2 : 0,_LoadingLeft = _PageWidth > 215 ? (_PageWidth - 215) / 2 : 0;
//加载gif地址
var Loadimagerul="/Content/LoadJs/Image/loading.gif";
//在页面未加载完毕之前显示的loading Html自定义内容
var _LoadingHtml = '';
//呈现loading效果
document.write(_LoadingHtml);
//监听加载状态改变
document.onreadystatechange = completeLoading;
//加载状态为complete时移除loading效果
function completeLoading() {
if (document.readyState == "complete") {
var loadingMask = document.getElementById('loadingDiv');
loadingMask.parentNode.removeChild(loadingMask);
}
}
使用的时候,只需要在Head中引入就可以
@*//加载JS动画效果*@
效果如下:引入后,加载Heml内容和样式的时候,会出现加载动画,加载完毕后显示出来,避免逐渐渲染出现的卡顿画面。
渲染完成,一次性显示渲染画面.
以上所述是小编给大家介绍的EasyUI加载完Html内容样式渲染完成后显示。编程之家 jb51.cc 收集整理的教程希望能对你有所帮助,如果觉得编程之家不错,可分享给好友!感谢支持。