EasyUI在屏幕右下角弹出Dialog


首先计算dialog离屏幕顶端和左边的距离,然后在初始化dialog的时候定义top和left属性。

jQuery获取当前窗口可视区域的高度和宽度的代码:

     $(window).height() //浏览器当前窗口可视区域高度
     $(window).width() //浏览器当前窗口可视区域宽度

用一个例子来说明,例如用户登陆后弹出公告信息:

首先定义div:

<div id="noticeDialog" class="easyui-dialog" title="公告" data-options="iconCls:'icon-tip',closed:true,resizable:true">  
     <table id="noticeTable"></table>   
 </div>  
JS代码

// 弹出公告框  
var dialogWidth = 580;      // dialog的宽度  
var dialogHeight = 250;     // dialog的高度  
var topPosition = $(window).height() - dialogHeight;  
var leftPosition = $(window).width() - dialogWidth;  
$('#noticeDialog').dialog({  
    width: dialogWidth,  
    height: dialogHeight,  
    top : topPosition,  
    left : leftPosition,  
    title:'公告'  
}).dialog('open');