js弹出层(jQuery插件形式附带reLoad功能)

　　(function($){

　　$.module={

　　_showCoverLayer:function(){//显示遮盖层

　　this.coverLayer=$("#TB_overlay");

　　var height=$(document).height()+"px";

　　var width=$(document).width()+"px";

　　if(this.coverLayer.length>0){

　　this.coverLayer.css({"visibility":"visible","height":height,"width":width});

　　}else{

　　this.coverLayer=$("<div id='TB_overlay' style='height:"+height+";width:"+width+"'></div>");

　　$("body").append(this.coverLayer);

　　}

　　},

　　_hideCoverLayer:function(){//隐藏遮盖层

　　this.coverLayer.css("visibility","hidden");

　　},

　　_showAjaxLoad:function(imgUrl){

　　this.ajaxLayer=$("#TB_load");

　　if(this.ajaxLayer.length>0){

　　this.ajaxLayer.css({"visibility":"visible"});

　　$("#TB_loadContent").css({"display":"block"});

　　}else{

　　this.ajaxLayer=$("<div id='TB_load'><div id='TB_loadContent'><img src='"+imgUrl+"' /></div></div>");

　　$("body").append(this.ajaxLayer);

　　}

　　},

　　_hideAjaxLoad:function(){

　　this.ajaxLayer.css("visibility","hidden");

　　$("#TB_loadContent").css({"display":"none"});

　　},

　　showWin:function(opt){//url,title,width,height,fixTop,fixLeft,imgUrl,top

　　this._showCoverLayer();

　　this.imgUrl=opt.imgUrl || "/image/ajax-loader.gif";

　　this._showAjaxLoad(this.imgUrl);

　　this.win=$("#TB_window");

　　var that=this;

　　if(this.win.length==0){

　　this.win=$("<div id='TB_window'></div>");

　　$("body").append(this.win);

　　this.win.append("<div id='TB_closeAjaxWindow' style='cursor:move' onmousedown='drag(this.parentNode,event);'><span id='TB_close'>X</span><span id='TB_title'>"+opt.title+"</span></div><div id='TB_ajaxContent'></div>");

　　$("#TB_close").click(function(){

　　that.hideWin();

　　});

　　}

　　this._init(opt);

　　$("#TB_ajaxContent").load(opt.url, function() {

　　that._hideAjaxLoad();

　　that.win.slideDown("normal");

　　});

　　},

　　hideWin:function(){

　　var that=this;

　　this.win.fadeOut("fast",function(){

　　that._hideCoverLayer();

　　});

　　},

　　_init:function(opt){

　　$("#TB_title").html(opt.title);

　　var top=opt.top || ( $(window).height() - opt.height ) /2+(opt.fixTop || 0);// +$(window).scrollTop() ;

　　var left=( $(window).width() - opt.width ) / 2+(opt.fixLeft || 0);//+$(window).scrollLeft();

　　this.win.css({"height":opt.height+"px",

　　"width":opt.width+"px",

　　"top":top+"px",

　　"left":left+"px"

　　});

　　},

　　reLoad:function(opt){//加载新页面

　　var that=this;

　　this.win.fadeOut("fast",function(){

　　that._showAjaxLoad(that.imgUrl);

　　that._init(opt);

　　$("#TB_ajaxContent").load(opt.url, function() {

　　that._hideAjaxLoad();

　　that.win.fadeIn("normal");

　　});

　　});

　　}

　　}

　　})(jQuery);

　　body {background-color:#fff;}

　　html, body {height:100%;}

　　html body{font:12px Arial, Helvetica, sans-serif;color:#333333}

　　html>body{font:12px Arial, Helvetica, sans-serif;color:#333333}

　　#TB_overlay {

　　position: absolute;

　　top: 0;

　　left: 0;

　　z-index:100;

　　width: 100%;

　　height: 100%;

　　background-color:#CCC;

　　filter:alpha(opacity=60);

　　-moz-opacity: 0.6;

　　opacity: 0.6;

　　}

　　#TB_window {

　　top: 0px;

　　left: 0px;

　　position: fixed;

　　_position: absolute;

　　background: #fff;

　　z-index: 102;

　　color:#000000;

　　display:none;

　　border:5px solid #666;

　　}

　　#TB_caption{

　　height:25px;

　　padding:10px 30px 10px 25px;

　　}

　　#TB_closeWindow{

　　height:25px;

　　padding:10px 25px 10px 0;

　　float:right;

　　}

　　#TB_closeAjaxWindow{

　　padding:5px 10px 7px 0;

　　margin-bottom:1px;

　　text-align:right;

　　background-color:#e8e8e8;

　　}

　　#TB_close{

　　cursor:pointer;

　　}

　　#TB_title{

　　float: left;

　　font-weight: bold;

　　margin-left: 10px;

　　}

　　#TB_ajaxContent{

　　padding:2px 15px 15px 15px;

　　overflow:auto;

　　}

　　#TB_load{

　　text-align: center;

　　position: fixed;

　　top: 50%;

　　left: 0px;

　　width: 100%;

　　overflow: visible;

　　visibility: visible;

　　display: block;

　　z-index:101;

　　}

　　/*Download by http://sc.xueit.com*/

　　#TB_loadContent{

　　margin-left: -125px;

　　position: absolute;

　　top: -50px;

　　left: 50%;

　　width: 250px;

　　height: 100px;

　　visibility: visible;

　　}

　　$.module.showWin({url:"/deposit/clear/"+depositId+"?"+(+new Date),

　　title:"清退关闭",

　　width:550,

　　height:350});

　　$.module.hideWin();