jquery easyui滾動條視窗居中
阿新 • • 發佈:2018-12-23
使用dialog外掛時,預設是螢幕居中的,但是當頁面出現滾動條時,dialog並沒有隨著滾動條往下滾動,這時就需要使用者滑動滾動條來定位dialog,這不人性化,在說出解決方案前先來普及一下jquery關於定位的幾個方法
//獲取瀏覽器顯示區域的高度
$(window).height();
//獲取瀏覽器顯示區域的寬度
$(window).width();
//獲取頁面的文件高度
$(document.body).height();
//獲取頁面的文件寬度
$(document.body).width();
//獲取滾動條到頂部的垂直高度
$(document).scrollTop();
//獲取滾動條到左邊的垂直寬度
$(document).scrollLeft();
ok,下面問題就很好處理了,移動dialog有現成的函式,不過dialog本身沒有move函式,但是dialog是繼承自panel的,panel有move函式,因此可以呼叫panel的move函式來移動dialog
複製程式碼
$('#dlg').dialog('open');
$("#dlg").panel("move",{top:$(document).scrollTop() + ($(window).height()-250) * 0.5});
其中 $(window).height()-250,這裡250px是dialog的寬度。 ----這個地方我自己試驗的是高度 不是寬度