EasyUI界面加载等待效果

最新推荐文章于 2021-08-06 13:11:26 发布

xiaoqiu_net

最新推荐文章于 2021-08-06 13:11:26 发布

阅读量1.2w

点赞数 1

分类专栏： jQuery EasyUI

本文链接：https://blog.csdn.net/q646926099/article/details/53158731

版权

本文介绍了如何在使用EasyUI的tab页面加载时添加等待效果，以改善因页面渲染缓慢导致的用户体验问题。通过引入easyui.js基础脚本，可以实现这一功能。

摘要由CSDN通过智能技术生成

使用EasyUI tab页面，加载页面的时候可能会渲染很慢，体验不是很好，加一个简单的等待效果吧。

使用此脚本需要先引入easyui.js基础脚本。

var maskWidth = $(window).width();
var maskHeight = $(window).height();
var maskHtml = "<div id='maskLoading' class='panel-body' style='z-index:1000;position:absolute;left:0;width:100%;";
maskHtml += "height:" + maskHeight + "px;top:0'>";
maskHtml += "<div class='panel-header panel=loading' style='position:absolute;cursor:wait;left:" + ((maskWidth / 2) - 100) + "px;top:" + (maskHeight / 2 - 50) + "px;width:150px;height:16px;";
maskHtml += "padding:10px 5px 10px 30px;font-size:12px;border:1px solid #ccc;background-color:white;'>";
maskHtml += "页面加载中&