(function($){

/**
* 遮罩插件
* 使用:$('#id').qloading(options);
* 详见:/plugins/_11_qloading/qloading.html
* options:定制选项,默认配置见$.fn.qloading.defaults
*
* hide : 隐藏遮罩,默认为false
* zindex : 遮罩背景的zindex,默认为9000
* bgcolor : 遮罩背景的色值,默认为#fff,也可以使用rgba色值
* imgurl : 遮罩中间的图片地址
* imgwidth : 遮罩中间的图片宽度
* imgheight: 遮罩中间的图片高度
* imgzindex: 遮罩中间的图片zindex,默认为9001
*/
$.fn.qloading = function(opts){
var options = $.extend({}, $.fn.qloading.defaults, opts);

return this.each(function(){
var $el = $(this);

if(options.hide){
if($el.find('.ng-loading').length) $el.find('.ng-loading').hide().remove();
}else{
var top = $el.offset().top;
var left = $el.offset().left;
var height = $el.height();
var width = $el.width();
var imgmargin = '-' + parseInt(options.imgheight/2) + 'px 0 0 -' + parseInt(options.imgwidth/2) + 'px';

$('<div class="ng-loading"><img src="' + options.imgurl + '" /></div>')
.css({
'position' : 'absolute',
'z-index' : options.zindex,
'top' : top,
'left' : left,
'display' : 'none',
'width' : width,
'height' : height,
'background-color' : options.bgcolor
}).appendTo($el).find('img').css({
'position' : 'absolute',
'z-index' : options.imgzindex,
'top' : '50%',
'left' : '50%',
'display' : 'none',
'width:' : options.imgwidth,
'height' : options.imgheight,
'margin' : imgmargin
}).show().end().show();
}
});
};
$.fn.qloading.defaults = {
hide : false,
zindex : 9000,
bgcolor : '#fff',
imgurl : '//img.niuguwang.com/static/img/0/loading.gif',
imgwidth : 64,
imgheight : 64,
imgzindex : 9001
};

})(jQuery);

原地址:http://git.oschina.net/uikoo9/lzqdbnur5h24wo6s8af79.code.git

jquery简单插件写法的更多相关文章

  1. 五子棋项目总结 JavaScript+jQuery(插件写法)+bootstrap(模态框)

    Html部分(界面): 1.五子棋棋盘由canvas完成: 2.两个按钮,样式由bootstrap完成: 3.菜单按钮对应的模态框,可以选择游戏模式:玩家自由对战,和电脑对战,还可以指定谁先执子和哪个 ...

  2. Jquery 自定义插件写法(示例)

    (function ($) { $.SmsHelper = $.SmsHelper || {}; $.extend($.SmsHelper, { //插件具体实现代码 yzmnum: 60, Ajax ...

  3. jquery简单插件到复杂插件(1)--tabs

    写在前面,到了新公司开始转做前段,之前一直写php,一共写了半年,转过来,jq都用不好,但是还是得不断的学习,谁没菜过.从最简单的开始写,最近也在学习些html5的小游戏,加油吧.js原生写的可以说惨 ...

  4. jquery简单插件到复杂插件(3)--顶部导航固定

    那个效果很多,比如hao123的头部 <!DOCTYPE html> <html> <head> <meta charset="UTF-8" ...

  5. jquery简单插件到复杂插件(2)--简单手风琴

    手风琴就是展示与隐藏 <div id="dataContent"> <div class="dataLeft fl"> <div ...

  6. [转]jQuery插件写法总结以及面向对象方式写法

    本文转自:http://www.xuanfengge.com/jquery-plug-in-written-summary-and-summary-of-writing-object-oriented ...

  7. sDashboard:简单的,轻量级的 jQuery 仪表板插件

    sDashboard 是一个轻量的仪表板 jQuery 插件,转换一个对象数组到仪表板.数组中的每个对象将被呈现为一个仪表板组件,可以通过左右拖 ​动重新排列. sDashboards 内置渲染 Da ...

  8. jQuery form插件的使用--用 formData 参数校验表单,验证后提交(简单验证).

    Form Plugin API 里提供了很多有用的方法可以让你轻松的处理表单里的数据和表单的提交过程. 测试环境:部署到Tomcat中的web项目. 一.引入依赖js <script src=& ...

  9. Jquery插件写法及extentd函数

    JQuery插件写法 JQuery插件又分为类扩展方法和对象扩展方法两种,类插件是定义在JQuery命令空间的全局函数,直接通过可调用,如可调用,如可调用,如.ajax():对象插件是扩展JQuery ...

随机推荐

  1. JAVA基础学习——1.3 关于JAVA环境变量设定 Path,Java_Home,ClassPath

    在安装完JDK以后,要设定JAVA环境变量. 刚接触的时候,我很困惑,这特么什么玩意啊,然后知其然不知其所以然的 按照说明做完了却不知道为什么这么做,这里简单做一些总结说明. 首先,什么是环境变量 环 ...

  2. 小的div在大的div中垂直居中

    方法一: 1.代码: <div style="width:200px;height:200px;border:solid blue;position:relative;"&g ...

  3. Debian8.3安装flash插件,备用~~~

    debian的浏览器iceweasel默认没有安装flash播放器,flash player这坨shit,容易使浏览器崩溃,但看在线视频又不得不用这货. 有两种安装方法: 一.安装压缩包 1.先去官网 ...

  4. win8 app GridView点击子项布局变更

    要触发点击必须设置IsItemClickEnabled="True" 要变更布局代码如下: private void gridView_ItemClick_1(object sen ...

  5. 阿里云部署多个tomcat

    转载自:http://www.cnblogs.com/lhj588/p/3805268.html 同时支持windows阿里云服务器 部署前准备: 1.到阿里云官网购买一台服务器 2.给阿里云服务器挂 ...

  6. ios Carthage

    使用CocoaPods来管理第三方框架很多人都知道,相对来说Carthage比较陌生,Carthage也是来管理第三方框架的,既然已经有了Cocoapods为什么还要有Carthage呢?使用Cart ...

  7. spring注解总结

      • @Controller 表示 负责注册一个bean 到spring 上下文中,bean 的ID 默认为类名称开头字母小写,表示某类是一个控制器组件 • @Service 表示负责注册一个bea ...

  8. CSS样式表基础

    CSS的样式表其实就是美观页面的,加一些样式. 一.样式表的三种分类: ①内联样式:写在某一个标签里面的样式. 优点:控制精确. 缺点:代码重用性差.(太多了不好写)页面代码乱.(太乱,后期不方便看) ...

  9. python中的反射

    在绝大多数语言中,都有反射机制的存在.从作用上来讲,反射是为了增加程序的动态描述能力.通俗一些,就是可以让用户参与代码执行的决定权.在程序编写的时候,我们会写很多类,类中又有自己的函数,对象等等.这些 ...

  10. Visual Studio (VS IDE) 你必须知道的功能和技巧 - 【.Net必知系列】

    前言 本文主要阐述一些Visual Studio开发下需要知道的少部分且比较实用的功能,也是很多人忽略的部分.一些不常用而且冷门的功能不在本文范围,当然本文的尾巴[.Net必知系列]纯属意淫,如有雷同 ...