当前位置: 首页 > news >正文

html loading插件,推荐一款我自己开发的jquery loading插件

开发中你有遇到过这样的需求吗?

将页面或者某个区域遮罩,显示 loading 效果,并按照需求变化loading框内容;

本插件致力于解决上述问题。

插件长什么样?

bVyRN0

我对它的评价是:不是巨丑,是简约而突出的。

怎么使用?

你可以有两种方式获得此插件:

从github上获取;

从npm上获取,通过npm install jquery.mloading.js命令安装插件;

获取到插件代码后,将jquery.mloading.js和jquery.mloading.css引入到页面,调用:

$(element).mLoading({

text:"",//加载文字,默认值:加载中...

icon:"",//加载图标,默认值:一个小型的base64的gif图片

html:false,//设置加载内容是否是html格式,默认值是false

content:"",//忽略icon和text的值,直接在加载框中显示此值

mask:true//是否显示遮罩效果,默认显示

});

$("body").mLoading();//就是给整个页面添加loading效果

$("#box").mLoading();//就是#box element添加loading效果

当设置mask后,如果觉得遮罩效果不明显或者太强烈,可以修改css文件中的.mloading.mloading-mask``类,改变背景色的透明度即可。

注意:本插件不支持对过小元素的loading,如给某个按钮、某个input添加遮罩;使用时应该尽量在容器上进行loading遮罩。

关于兼容性和jquery版本

本插件支持所有主流浏览器,并支持ie8+,在选择jquery版本时没有过多的限制,主流版本都可以支持。

相关文章:

  • struts2 html post large data,十一、Struts2 文件上传
  • HTML表格上边境不显示,如何显示的iframe边界之外HTML元素
  • xhtml1.0与html5,将Doctype从XHTML 1.0升级到HTML5会导致简单html页面中的布局差异
  • 纽约州立计算机科学,纽约州立大学宾汉姆顿分校计算机科学申请条件有哪些?...
  • 计算机中互交式用户在哪找,如何在Windows中获取当前数量的交互式用户会话?...
  • web浏览不支持html5,mui适用场景说明,能不能在普通浏览器里使用,能否用于wap网站...
  • 计算机网络信息安全管理办法,计算机网络信息安全管理实施细则.doc
  • html5 全屏样式,HTML5 全屏特性
  • 计算机软考网络工程师历年真题,2019上半年软考网络工程师考试下午真题
  • plc是一台专用计算机对,PLC其实质上是一台工业控制用的专用计算机,它由硬件系统和软件系统两大部分组成...
  • 南航计算机英语面试自我介绍,南航应聘英语自我介绍4篇
  • 计算机系统 理论知识试卷,计算机理论期中考试题
  • 2000的笔记本能HTML,我想买一个笔记本,最好是2000--3000元,请高人给个配置单。谢谢,家用的。...
  • 安徽财贸职业学院计算机信息管理怎么样,让别人看看安徽财贸职业学院计算机系汪永涛辅导员如何对待我的!!...
  • 匹兹堡大学计算机科学世界排名,2020年匹兹堡大学QS世界排名