CSS制作提示框 ‘正在加载请。。。。。’
发布时间：2017-09-14 09:50:08 作者：佚名 
我要评论
我要评论最近做项目遇到这样的需求，页面加载数据比较慢，一直没有反应，下面小编给大家带来了基于CSS制作提示框 ‘正在加载请。。。。。’功能，需要的朋友参考下吧
需求：
有时加载数据比较慢，页面一直没有反应，用户也许会不停的刷，而且用户体验也不好
解决：
在js中加入以下代码即可
//提示信息
function AddRunningDiv() {
$("<div class=\"datagrid-mask\"></div>").css({ display: "block", width: "100%", height: $(document).height() }).appendTo("body");
$("<div class=\"datagrid-mask-msg\"></div>").html("正在处理，请耐心等待...").appendTo("body").css({ display: "block", left: ($(document.body).outerWidth(true) - 190) / 2, top: ($(document).height() - 45) / 2 });
}
//取消提示信息
function MoveRunningDiv() {
$("div[class='datagrid-mask']").remove();
$("div[class='datagrid-mask-msg']").remove();
}
在需要的地方调用即可。
效果如下：整个页面不可编辑
总结
以上所述是小编给大家介绍的CSS制作提示框 ‘正在加载请。。。。。’，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对脚本之家网站的支持！
相关文章
是一款实现了多圆环同时旋转的多层圆环loading加载动画特效，非常有意思，大家可以自行替换颜色，适应于绝大多数的网站使用，欢迎有兴趣的朋友们前来下载使用2018-01-19
这是一款基于纯CSS3实现带有卫星轨道旋转效果的加载动画特效源码。画面上有三个颜色各异且相互独立的弧线在各自的轨道上旋转，整体呈现出轨道卫星动画的加载视觉效果2018-01-15- 这篇文章主要给大家介绍CSS 的加载及加载顺序以及遇到的问题思路解析，文中还给大家补充介绍了关于html，css，js三者的加载顺序问题，需要的朋友参考下吧2017-12-25
css3 animation制作loading白色圆点滑过加载动画特效源码
这是一款基于css3 animation制作白色圆点滑过加载动画特效源码，一组白色圆点从左向右依次滑过，圆点由小渐大模糊呈现。本段代码可以在各个网页使用，有需要的朋友可以直接2017-12-21
纯CSS3仿Skype圆点旋转加载动画特效源码是一款loader登录界面加载动画，圆点旋转加载动画。本段代码可以在各个网页使用，有需要的朋友可以直接下载使用2017-12-18
html5+css3实现的多彩旋转式svg加载动画特效源码是一段实现了非常炫酷也精致的svg加载动画效果，本段代码适应于所有网页使用，欢迎有兴趣的朋友前来下载2017-09-21
这篇文章主要介绍了css制作超萌吃豆豆加载动画效果,需要的朋友可以参考下2018-02-26
最新评论