Easyui 讓Window彈出居中與最大化後居中
阿新 • • 發佈:2018-12-23
easyui1.3.2版本,window的彈出不會居中了。而dialog是會居中的,我們必須為為window的open事件做擴充套件
程式碼如下:只要加入以下程式碼即可.如果你是看了MVC專案系列的,把他放到jquery.easyui.plus.js裡面就可以了
//讓window居中 var easyuiPanelOnOpen = function (left, top) { var iframeWidth = $(this).parent().parent().width(); var iframeHeight = $(this).parent().parent().height(); var windowWidth = $(this).parent().width(); var windowHeight = $(this).parent().height(); var setWidth = (iframeWidth - windowWidth) / 2; var setHeight = (iframeHeight - windowHeight) / 2; $(this).parent().css({/* 修正面板位置 */ left: setWidth, top: setHeight }); if (iframeHeight < windowHeight) { $(this).parent().css({/* 修正面板位置*/ left: setWidth, top: 0 }); } $(".window-shadow").hide(); }; $.fn.window.defaults.onOpen = easyuiPanelOnOpen;
完美居中。
點選最大化後,再次最小化時也會出現不居中現象,我們必須,擴充套件resize事件。
var easyuiPanelOnResize = function (left, top) { var iframeWidth = $(this).parent().parent().width();var iframeHeight = $(this).parent().parent().height(); var windowWidth = $(this).parent().width(); var windowHeight = $(this).parent().height(); var setWidth = (iframeWidth - windowWidth) / 2; var setHeight = (iframeHeight - windowHeight) / 2; $(this).parent().css({/* 修正面板位置 */ left: setWidth-6, top: setHeight-6 }); if (iframeHeight < windowHeight) { $(this).parent().css({/* 修正面板位置 */ left: setWidth, top: 0 }); } $(".window-shadow").hide(); //$(".window-mask").hide().width(1).height(3000).show(); }; $.fn.window.defaults.onResize = easyuiPanelOnResize;
window元件可以相容了