Jquery easyui 弹出窗口居中显示

阅读更多

   在用easyui+iframe创建新窗口的时候,窗口不能居中显示,在网上找了N久,终于找到方法。

   以下为个人封装的创建dialog的js 通用方法

  

   function openDialog(options) {
    if (options.windowObj) {
        $windowObj = null;
        $windowObj = options.windowObj;
    }
    if (!options.id) {
        options.id = "dialogContainer";
    }
    dialogId = options.id;
    if (!options.title) {
        options.title = "操作面板";
    }
    if (!options.buttons) {
        options.buttons = '#dlg-buttons';
    } else if (options.buttons == "closed") {
        options.buttons = "";
    }
    if (!options.iconCls) {
        options.iconCls = 'icon-cc';
    }
    if (!options.width) {
        options.width = 820;
    }
    if (!options.height) {
        options.height = 500;
    }
    if (!options.maximizable) {
        options.maximizable = false;
    }
    if (!options.draggable) {
        options.draggable = true;
    }
    $("#" + options.id + "Frame").attr("src", options.url);
    $("#" + options.id).dialog({
        "iconCls" : options.iconCls,
        "title" : options.title,
        "width" : options.width,
        "height" : options.height,
        "maximizable" : options.maximizable,
        draggable : options.draggable,
        buttons : options.buttons
    }).dialog("open");
    var top=(screen.height-options.height)/2-30 ;  
    var left=(screen.width-options.width)/2;
    $("#" + options.id).panel("move",{left:left,top:top});
}

   其中:

   //screen为电脑的分辨率

   var top=(screen.height-options.height)/2-30 ;  
    var left=(screen.width-options.width)/2;
    $("#" + options.id).panel("move",{left:left,top:top});

    以上三行根据窗体跟屏幕大小计算top跟left,并用panel的move方法调整left和top属性。

    在调用的时候可以为

   openDialog({
        windowObj : window,
        url : url,
        title : "导入用户",
        buttons : false,
        width : 600,
        height: 400   
        });

 

你可能感兴趣的:(easyui,dialog)