1. 程式人生 > >easyui防止panel,dialog,window超出父元素邊界

easyui防止panel,dialog,window超出父元素邊界

var easyuiWindowOnMove = function(left, top) {
//如果不在操作範圍則不移動
if((top == 1 && left > 0 ) || (left == 1 && top > 0 ) ) return;

var parentObj = $(this).panel('panel').parent(); //父級容器
var obj = $(this).panel('options');      //當前視窗
var left1,top1,l = parentObj.width() - obj.width, t = parentObj.height() - obj.height;
var overflow = parentObj.css("overflow") == "hidden" ? true : false;
//left  top  為當前拖動的window視窗的相對於父級容器的左邊距跟上邊距

if ((left < 0) || (overflow && l < 0 )) {
left1 = 1 ;
}
if ((top < 0) || (overflow && t < 0 )) {
top1 = 1 ;
}
if(overflow && (left > l && l > 0)){
left1 = l ;
}
if(overflow && (top >  t && t > 0)){
top1 = t ;
}
if(left1 || top1){ //此處移動需注意,要在最後進行,不然有情況是無法擺脫滑鼠的拖動事件,卡死瀏覽器
$(this).window('move', {
"left":  left1,
"top":  top1
});
}
};
$.fn.panel.defaults.onMove = easyuiPanelOnMove;
$.fn.window.defaults.onMove = easyuiWindowOnMove;
$.fn.dialog.defaults.onMove = easyuiPanelOnMove;