2009年7月3日 星期五

將顯示的物件放在畫面正中央

function getPageSize() {
  //個函數的具體作用是獲得網頁的高度和寬度,
  //如果網頁沒有窗口可見區域高的時候則取窗口的可見區域高度和寬度。
  //返回值為一個對像,
  //例如 { width:123, height:345}。
  //幾乎兼容所有的瀏覽器
  var re = {};
  if (document.documentElement
       && document.documentElement.clientHeight) {
    var doc = document.documentElement;
    re.width = (doc.clientWidth>doc.scrollWidth)?
      doc.clientWidth-1:doc.scrollWidth;
    re.height = (doc.clientHeight>doc.scrollHeight)?
      doc.clientHeight:doc.scrollHeight;
  } else {
    var doc = document.body;
    re.width = (window.innerWidth>doc.scrollWidth)?
      window.innerWidth:doc.scrollWidth;
    re.height = (window.innerHeight>doc.scrollHeight)?
      window.innerHeight:doc.scrollHeight;
  }
  return re;
}

var obj = document.getElementById("物件ID");
obj.style.display = "";
var cH = document.documentElement.clientHeight;
var cW = document.documentElement.clientWidth;
var sT = document.documentElement.scrollTop;
var sL = document.documentElement.scrollLeft;

obj.style.pixelTop = (cH -obj.offsetHeight)/2 + sT;
obj.style.pixelLeft = (cW -obj.offsetWidth)/2 + sL;
下面是各個的說明
obj.style.pixelLeft:設定物件x的矩離
obj.style.pixelTop:設定物件y的矩離
obj.offsetWidth:物件寬度
obj.offsetHeight:物件高度
document.documentElement.clientWidth:視窗寬度
document.documentElement.clientHeight:視窗高度
document.documentElement.scrollLef:捲軸水平移動矩離
document.documentElement.scrollTop:捲軸垂直移動矩離

沒有留言: