基于jeasyui的遮罩扩展[修复链式bug]
说明和使用方法看下面代码,直接复制下面代码保存为js文件,引用即可。
遮罩效果从datagrid中提取,针对jquery进行优化。
下载地址(附Demo):http://pan.baidu.com/share/link?shareid=2241984917&uk=1325762948
/**
* easyUI - mask
* easyUI - 遮罩
* @author isea533
* @author http://blog.csdn.net/isea533
*
*
* Requires:
* 依赖:
* jquery.js
* jquery.easyui.js
*
* How to use:
* 使用方法:
* $('.class').easyMask('show'[,options]);
* $('.class').easyMask('hide'[,options]);
*
* $.easyMask('.class','show'[,options]);
* $.easyMask('.class','hide'[,options]);
*
* options = {msg:''}
* default options = $.easyMask.options;
*/
(function($){
//$对象
$.fn.easyMask = function(method,options){
return $.easyMask(this,method,options);
}
//全局函数
$.easyMask = function(target,method,options){
var tar = target||'body';
var $targ = $(tar);
var opt = $.extend({},$.easyMask.options,options);
var method = $.easyMask.methods[method];
if(method){
return method(tar,opt);
}
return $targ;
}; $.easyMask.methods = {
show:function(target,options){
return $(target).each(function(){
var $targ = $(this);
//如果当前对象不是relative,那就添加该属性
//$("#hehe").css("position")
if($targ.css('position')!='relative'){
$targ.data('position',$targ.css('position'));
$targ.css('position','relative');
}
$('<div class=\'datagrid-mask\' style=\"display:block\"></div>').appendTo($targ);
var msg = $('<div class=\'datagrid-mask-msg\' style=\"display:block;left:50%\"></div>')
.html(options.msg).appendTo($targ);
msg.css("marginLeft", -msg.outerWidth() / 2);
});
},
hide:function(target,options){
return $(target).each(function(){
$here = $(this);
$here.children('.datagrid-mask').remove();
$here.children('.datagrid-mask-msg').remove();
//还原position属性
if($here.data().position!=undefined){
$here.css("position",$here.data().position);
$here.removeData('position');
}
});
}
} $.easyMask.options = {
msg:'Loading...'
};
})(jQuery)
Demo效果:
基于jeasyui的遮罩扩展[修复链式bug]的更多相关文章
- 基于mybatis-generator代码生成工具改(链式方法实体版)
概述 一直以来使用原生mybatis-generator的我发现有一个地方很不方便,即它生成的实体类的set方法返回值是void,而目前比较流行的则是链式set的写法,即set方法返回值不再是void ...
- sql的行转列(PIVOT)与列转行(UNPIVOT) webapi 跨域问题 Dapper 链式查询 扩展 T4 代码生成 Demo (抽奖程序)
sql的行转列(PIVOT)与列转行(UNPIVOT) 在做数据统计的时候,行转列,列转行是经常碰到的问题.case when方式太麻烦了,而且可扩展性不强,可以使用 PIVOT,UNPIVOT比 ...
- ASP.NET MVC学前篇之扩展方法、链式编程
ASP.NET MVC学前篇之扩展方法.链式编程 前言 目的没有别的,就是介绍几点在ASP.NETMVC 用到C#语言特性,还有一些其他琐碎的知识点,强行的划分一个范围的话,只能说都跟MVC有关,有的 ...
- C#中扩展StringBuilder支持链式方法
本篇体验扩展StringBuilder使之支持链式方法. 这里有一个根据键值集合生成select元素的方法. private static string BuilderSelectBox(IDicti ...
- Dapper 链式查询 扩展
Dapper 链式查询扩展 DapperSqlMaker Github地址:https://github.com/mumumutou/DapperSqlMaker 欢迎大佬加入 Demo: 查询 ...
- 基于JDK动态代理实现的接口链式调用(Fluent Interface)工具
什么是链式接口(Fluent Interface) 根据wikipedia上的定义,Fluent interface是一种通过链式调用方法来完成方法的调用,其操作分为终结与中间操作两种.[1] 下面是 ...
- Unity 游戏框架搭建 (十八) 静态扩展 + 泛型实现transform的链式编程
本篇文章介绍如何实现如下代码的链式编程: C# this.Position(Vector3.one) .LocalScale(1.0f) .Rotation(Quaternion.identity); ...
- Unity 游戏框架搭建 (十七) 静态扩展GameObject实现链式编程
本篇本来是作为原来 优雅的QChain的第一篇的内容,但是QChain流产了,所以收录到了游戏框架搭建系列.本篇介绍如何实现GameObject的链式编程. 链式编程的实现技术之一是C#的静态扩展.静 ...
- jQuery链式编程时修复断开的链
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
随机推荐
- Qt编程之实现在QFileDialog上添加自定义的widget
上网搜索找到的方法如下: http://www.qtforum.org/article/20841/how-to-add-a-qwidget-in-qfiledialog.html#post78422 ...
- Thread详解
具体可参考:Java并发编程:Thread类的使用,这里对线程状态的转换及主要函数做一下补充. 一.线程状态转换图 注意: 阻塞状态是线程阻塞在synchronized代码块时的状态,而阻塞在Lock ...
- Weekend counter
Weekend counter Sofia has given you a schedule and two dates and told you she needs help planning he ...
- 【转】Android下编译jni库的二种方法(含示例)
原文网址:http://blog.sina.com.cn/s/blog_3e3fcadd01011384.html 总结如下:两种方法是:1)使用Android源码中的Make系统2)使用NDK(从N ...
- POJ 1300 欧拉通路&欧拉回路
系统的学习一遍图论!从这篇博客开始! 先介绍一些概念. 无向图: G为连通的无向图,称经过G的每条边一次并且仅一次的路径为欧拉通路. 如果欧拉通路是回路(起点和终点相同),则称此回路为欧拉回路. 具有 ...
- 用Visual Studio2010 编译 C++文件"hello world”
本周开始学习C++语言,用Visual Studio 2010做编译器,发现站内还没有基础的关于用VS2010编译程序的教材.而且自己在网上寻找时候,教程难找,而且大都不详细.故写一个关于这方面的教程 ...
- 针对各主流数据mysql、sqlserver、oracle中文乱码问题。
针对各主流数据mysql.sqlserver.oracle当以编码格式gbk存放数据时,要注意字符串类型的字段,要采用宽字符串nvarchar存放,前提是当你的应用程序是utf8编码,而数据库是gbk ...
- 用户向导页面实现左右滑动的ImageSwitcher
当你第一次打开app时刻,通常有使用向导现在演示APK基本功能和用法,该向导是非常重要的,用户可以知道并调整到速度app如何. 实现此使用向导有非常多种方法,比方用ImageSwitcher.View ...
- chart.js制作折线图
<!DOCTYPE html> <html> <head> <title></title> </head> <script ...
- docker 数据管理
一,介于创建docker容器退出或者删除容器数据无法得以保存以及docker容器中的分区较小的问题存在,未解决该问题,可以使用参考以下几种方法. 1,将宿主的目录挂载到容器中去. docker run ...