jquery简单插件写法


(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

优质内容筛选与推荐>>
1、xfs文件系统的备份和恢复
2、做生意和打工的区别
3、经典算法研究系列:七、深入浅出遗传算法,透析GA本质
4、模拟Spring中applicationContext.xml配置文件初始化bean的过程
5、[zz]zend studio


长按二维码向我转账

受苹果公司新规定影响,微信 iOS 版的赞赏功能被关闭,可通过二维码转账支持公众号。

    阅读
    好看
    已推荐到看一看
    你的朋友可以在“发现”-“看一看”看到你认为好看的文章。
    已取消,“好看”想法已同步删除
    已推荐到看一看 和朋友分享想法
    最多200字,当前共 发送

    已发送

    朋友将在看一看看到

    确定
    分享你的想法...
    取消

    分享想法到看一看

    确定
    最多200字,当前共

    发送中

    网络异常,请稍后重试

    微信扫一扫
    关注该公众号