jquery 彈出插件

//彈層 dialog
/*options{content:彈層內容(必傳),title:彈層標題(可選), width:(寬,可選,沒有則自適應),height:(可選),drag:是否可拖動,默認false,mask:是否須要遮罩層*/
var d_dialog=function(options){
  if(options){
    var template='<div class="d-dialog"><div class="d-dialog-h clearfix"><span class="closebtn fR"></span>'+(options.title!=null?('<span class="title fL">'+options.title+'</span>'):'')+'</div><div class="d-dialog-con">'+options.content+'</div></div>';
    if(options.mask){//遮罩層
      var mask='<div class="d-dialog-mask"></div>';
      template=mask+template;
    }
    options.dialog=jq('<div class="d-dialog-wrap">'+template+'</div>');
    jq('body').append(options.dialog);
    //調整位置
    options.width=options.width?options.width:options.dialog.find('.d-dialog').width();
    options.height=options.height?options.height:options.dialog.find('.d-dialog').height();
    options.top=options.top?options.top:(jq(window).height()-options.height)/2;
    options.left=options.left?options.left:(jq(window).width()-options.width)/2;
    options.dialog.find('.d-dialog').css({width:options.width,height:options.height,top:options.top,left:options.left});
    jq(window).resize(function(){//窗口改變時
      options.top=(jq(window).height()-options.height)/2;
      options.left=(jq(window).width()-options.width)/2;
      options.dialog.find('.d-dialog').css({top:options.top,left:options.left});
    });
    //關閉彈層
    options.dialog.find('.closebtn').click(function(){
      options.dialog.remove();
    });
  }
};
相關文章
相關標籤/搜索