DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> JavaScript入門知識 >> jQuery入門知識 >> JQuery特效代碼 >> jquery easyui滾動條部分設置介紹
jquery easyui滾動條部分設置介紹
編輯:JQuery特效代碼     
在使用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的寬度。
XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved