jquery.loadmask.js

Quick Start

下载之后的目录结构如下图所示:

使用此插件非常简单,如下步骤所示:

1、  引用jquery,1.2.3以上版本

<script type="text/javascript" src="jquery-1.7.1.js"></script>

2、  引用jquery.loadmask.css、jquery.loadmask.js(或者min版jquery.loadmask.min.js)

<link href="jquery.loadmask.css" rel="stylesheet" type="text/css" />
<script type=‘text/javascript‘ src=‘jquery.loadmask.min.js‘></script>

3、  调用mask(label,delay)方法屏蔽DOM元素。

$("#myDiv").mask();
$("#myDiv").mask(“Loading…”);
$("#myDiv").mask(“Loading…”,500);

4、  调用unmask()方法解除屏蔽。

$("#myDiv").unmask();

5、  调用isMasked()方法判断某个DOM元素是否已屏蔽。

if($("#myDiv").isMasked()){
  $("#myDiv").unmask();
}

方法

mask([label] [,delay])

在选择的DOM元素上显示加载屏蔽层,支持一个或多个selectors。

定义

$.fn.mask = function(label, delay){
……
}

参数

label:

一个文本字符串,显示在最外层的一个加载提示信息(在等待图片边上),如果此参数值为undefined,则只显示一个不带等待图标和文本提示的屏蔽层;



=undefined

delay:

以毫秒为单位的延迟显示屏蔽层的时间,如果还没有到延迟时间又调用了unmask()方法,那么什么都不会发生,即不会再显示屏蔽层。

案例

$("#myDiv").mask();
$("#myDiv").mask(“Loading…”);
$("#myDiv").mask(“Loading…”,500);

unmask()

移除DOM元素上的屏蔽层,此方法支持一个或多个selector;

定义

$.fn.unmask = function(){
……
}

参数

案例

$("#myDiv").unmask();

isMasked()

检查一个DOM元素上是否有屏蔽层,如果没有屏蔽层或屏蔽层延迟显示,都返回false,否则返回true;

定义

$.fn.isMasked = function(){
……
}

参数

案例

if($("#myDiv").isMasked()){
  $("#myDiv").unmask();
}
时间: 2024-11-08 22:33:04

jquery.loadmask.js的相关文章

页面滚动图片等元素动态加载插件jquery.scrollLoading.js

如果一个网页很长,那么该页面的加载时间也会相应的较长.而这里给大家介绍的这个jQuery插件scrollLoading的作用则是,对页面元素进行动态加载,通俗的说就是滚到哪就加载到哪,屏幕以下看不见的就不用加载了.这样还可以在一定程度上节省服务器资源.该插件作者的网页将该插件的功能和使用方法描述的非常详细,这里把最一般最普遍的使用情况给大家展现一下. 插件作者:http://www.zhangxinxu.com/ 首先我们需要加载jQuery库和本插件js文件. (jquery.scrollLo

c#+jquery.autocomplete.js

html代码: $(document).ready(function () { $.ajax({ type: "POST", contentType: "json", url: "a.ashx?action=findlist", data: "{}", dataType: "html", success: function (data) { var dataset = eval('(' + data + '

js效果笔记:怎样实现图片的懒加载以及jquery.lazyload.js的使用

在项目中有时候会用到图片的延迟加载,那么延迟加载的好处是啥呢? 我觉得主要包括两点吧,第一是在包含很多大图片长页面中延迟加载图片可以加快页面加载速度:第二是帮助降低服务器负担. 下面介绍一下常用的延迟加载插件jquery.lazyload.js以及怎样实现一个延迟加载的插件. 一:jquery.lazyload.js插件 lazyload是jQuery写的延迟加载插件,在浏览器可视区域外的图片不会被载入, 直到用户将页面滚动到它们所在的位置. 这与图片预加载的处理方式正好是相反的. 实现原理 首

用这个插件jquery.raty.js————用于星星评价(这个案例用于后台传数据给我,前台显示星星个数)

1.引入jquery.js文件 2.引入jquery.raty.js 3.页面中放在这个:<span class="readOnly" data-path="images" ><i>4.5</i></span> 4.js: function star(obj,num){ $(obj).raty({ path: function() { return this.getAttribute('data-path');//路径

关于jquery.uploadify.js不兼容IE11

我们使用jquery.uploadify.js插件进行文件上传的时候,可能会遇到在IE11浏览器下点击上传按钮没有反应,看到很多博友们说的天花烂坠,最后问题没有解决掉,其实问题很简单,只是这个问题又很难被发现,那么接下来进入正式话题---- 之所以IE11没有显示出上传的对话框是因为这个插件的一个样式所导致,既:z-index 解决方案:打开jquery.uploadify.js插件,Ctrl+F,搜索z-index,此刻你会发现插件的z-index:1,就是这个原因导致IE11显示不出来,改成

jQuery.form.js jQuery ajax异步提交form

jQuery.form.js是一个form插件,支持ajax表单提交和ajax文件上传. 官网下载地址:http://plugins.jquery.com/form/ API ajaxForm 增加所有需要的事件监听器,为ajax提交表单做准备.ajaxForm并不能提交表单.在document的ready函数中,使用ajaxForm来为ajax提交表单进行准备. 接受0个或1个参数.参数可以是一个回调函数,也可以是一个Options对象. $("#formid").ajaxForm(

jquery.cookie.js使用

1.下载jquery.cookie.js 官网:http://plugins.jquery.com/cookie/ 或 http://pan.baidu.com/s/1mgynA8g 2.使用方法 复制代码 $.cookie('the_cookie'); // 获得cookie $.cookie('the_cookie', 'the_value'); // 设置cookie $.cookie('the_cookie', 'the_value', { expires: 7 }); //设置带时间的

jquery.pjax.js bug问题解决集锦

jquery.pjax 是一个很好的局部刷新插件,但实际应用过程是还是会有很多小问题,部分问题解决如下: 1.pjax 局部加载时候,IE 存在缓存问题,很容易理解,pjax是通过jquery的ajax加载局部内容的,默认cache=true,这会导致ie下get数据从缓存中获取,解决办法是设置pjax options的cache=false,这样请求会自动变成如下方式: /XXXX?_pjax=%23pjax-container&_=1455092848927 2.pjax 与 jquery

jQuery延迟加载(懒加载)插件 – jquery.lazyload.js

Lazy Load 是一个用 JavaScript 编写的 jQuery 插件. 它可以延迟加载长页面中的图片. 在浏览器可视区域外的图片不会被载入, 直到用户将页面滚动到它们所在的位置. 这与图片预加载的处理方式正好是相反的.在包含很多大图片长页面中延迟加载图片可以加快页面加载速度. 浏览器将会在加载可见图片之后即进入就绪状态. 在某些情况下还可以帮助降低服务器负担. Demo页面: 基本选项 淡入效果 对不支持JavaScript浏览器的降级处理 水平滚动 容器内水平滚动 容器内垂直滚动 页