jquery之弹出层插件

日前做了一个弹出层小插件,发布出来~~

jQuery(function($) {
    
var from;
    $.fn.opendialog 
= function(a) {
    from 
= $(this);

    
var doc = document;
    
var docElement = doc.documentElement;
    
var sHeight = docElement.clientHeight;
    
var dH = docElement.scrollHeight > sHeight ? docElement.scrollHeight : sHeight;
    
var scH = docElement.scrollTop >= 0 ? (docElement.scrollTop + sHeight / 2) : sHeight;
     hValue 
= scH - $(this)[0].clientHeight / 2;
     wValue 
= docElement.clientWidth / 2 - $(this)[0].clientWidth / 2;
        
var o = { overlay: true, bgColor: '#ffffff', opacity: 0.5,h:hValue,w:wValue, iw: $(this).attr('width'), ih: $(this).attr('height') };
        
if (a) {
            $.extend(o, a);
            
if ($("#Msgdiv").length == 0) {
                
var str = '';
                
if ($.browser.msie) {
                    str 
+= '<iframe id="Msgdiv" style="display:none"></iframe>';
                    $(str).appendTo(
"body");
                    
var cw = window.frames['Msgdiv'];
                    cw.document.open();
                    cw.document.write(
'<style type="text/css">body{background:' + o.bgColor + '}</style>');
                    cw.document.close();
                }
                
else {
                    str 
= '<div id="Msgdiv"><iframe style="display:none"></iframe></div>';
                    $(str).appendTo(
"body");
                }
            }
        }
        $(
this).show();
       $(
"#Msgdiv").css({  docElement.clientWidth, height: dH, position: 'absolute', zIndex: 9999, left: '0px', top: '0px', background: o.bgColor, opacity: o.opacity }).show();

        $(
this).css({ top: o.h, left: o.w, zIndex: 10001,  o.iw, height: o.ih }).fadeTo(4001);


        $(document).bind(
'keydown', $(this).EXC);

    }
    $.fn.hideDiv 
= function(fun) {
        $(
this).hide();  //关闭小层
        $('#Msgdiv').hide(); //关闭大层
        if (fun) eval(fun);
    }
    $.fn.EXC 
= function(e) {
        
var event = window.event || e;
        
if (event.keyCode == 27) {
            from.hideDiv();
        }
    }
});

调用方法:

 $('#ID名字).opendialog(参数);

记录点点滴滴,技术永无止境

原文地址:https://www.cnblogs.com/hqbird/p/1583219.html