jquery遮罩層插件

(function($){
$.fn.showOverlay = function(options){
    /*默認配置*/
    var defaults = {'switchModel':'click','opacity':'0.5','backgroundColor':'grey'};
    var _THIS = $(this);
    var opts = $.extend({},defaults, options);
    var overlay = document.createElement('div');
    $(overlay).attr('id','x-overlay-body');
    var overlayStyle = {
        'width':'100%',
        'height':'100%',
        'opacity':opts.opacity,
        'background-color':opts.backgroundColor,
        'position':'absolute',
        'overflow':'hidden',
        'z-index':1000,
        'top':'0px',
        'left':'0px'
    };
    
    $(overlay).css(overlayStyle);
    document.body.appendChild(overlay);
    _THIS.css('z-index','1001');
    $(overlay).show();
}
$.fn.unbindOverlay = function(){
    if($('#x-overlay-body')) $('#x-overlay-body').remove();
}
})(jQuery)
/*支持傳入參數:$(obj).showOverlay({'switchModel':'click','opacity':'0.5','backgroundColor':'grey'})*/

調用方式:$(obj).showOverlay(),$(obj).unbindOverlay()css

須要事先引入jqueryjquery

相關文章
相關標籤/搜索