/**
* 文件座標
* 視口座標
* 滑鼠座標
*
* 元素位置和尺寸
*/function xx()
// 偏移大小 包含邊框大小 內邊距大小 + 實際內容可視區域高度(如果有滾動條，包含滾動條大小)
// d1.offsetheight
}// 獲取視窗的滾動條偏移量
function getscrolloffsets(w)
}// 對所有在標準模式下的瀏覽器
var d = w.document;
if (d.compatmode === 'css1compat')
}// 如果處於怪異模式
return
}// 獲取視口尺寸
function getviewportsize(w)
}var d = w.document;
if (d.compatmode === 'css1compat')
}return
}// 返回乙個元素在**視口(viewport)座標系**中的座標以及該元素的尺寸(ie沒有包含元素的尺寸)
// dom.getboundingclientrect() //
// 包含padding和border，但不包含margin
function getbcr(dom)
// offsetwidth offsetheight
// 唯讀的
// 單位是px
// 包括border和padding，但包括margin
// offsetleft offsetright
// 對已定位元素的子孫或者table cell，返回的座標相對於祖先，如果offsetparent為null,則相對於document
// 計算乙個元素在**文件座標系**中的座標
function getelementposition(e)
return
}// offsetwidth包含border、content area、padding
// clientwidth跟offsetwidth的區別是前者不包含border,只有content area和 padding
// 如果有滾動條，clientwidth不包含滾動條的寬度，類似的clientheight不包含滾動條的高度
// 在內聯元素中clientwidth和clientheight總是為0
// 標準模式下document.documentelement或者怪異模式下document.body,當沒有垂直滾動條的時候呼叫 clientwidth跟 window.innerwidth返回的值是一致的，clientheight和 window.innerheight亦如此
// window.innerwidth，在有滾動條出現的情況下，預設已經包含了滾動條的寬度而document.documentelement.clientwidth是不包含滾動條寬度的
// 若果滾動條在左邊或者上面的位置，那麼clientleft或clienttop包含滾動條的寬度或者高度
// scrollwidth和scrollheight包含元素的content以及padding還有溢位(overflowing)的content
// scrollleft和scrolltop是可讀以及可寫的
// 因為html elements沒有scrollto，素以你可以設定scrollleft或scrolltop來達到同樣的目的
// 當文件包含可滾動的元素的時候(when a document contains scrollable elements with overflowing content)，上面的getelementposition有缺陷
// 原因是之前定義的getelementposition函式沒有考慮到scrollbar position(it does not take scrollbar position into account)
// 修改如下，修改後的版本返回的值跟 getboundingclientrect()一致(實踐證明還是有些許的偏差)
// 經過修復後，getelementposition2返回的是視口座標系中的座標,如果要轉換成為文件座標系中的座標則需要加上getviewportsize()返回的left和top
function getelementposition2(elt)
// 所有祖先元素
for (var e = elt.parentnode; e != null && e.nodetype == 1; e = e.parentnode)
return
}/**
* jquery offset() 返回的是文件座標系中的座標 如果要轉換為 視口座標系中的座標可以加上$(window|document).scrolltop() 和 $(window|document).scrollleft()
*
*/// 翻譯不好的書籍詬病：修飾(比如定於從句)資訊丟失，術語解釋彆扭，翻譯錯誤
// 糾正位於(0, 0)處元素的位置，ie會返回(2, 2),其他瀏覽器會返回(0, 0)
function getboundingclientrect(element)
var rect = element.getboundingclientrect();
var offset = arguments.callee.offset;
return
} else
}
}
js 獲取DOM尺寸 位置
檢視滾動條的滾動位置 封裝相容性方法getscrolloffset function getscrolloffset else 檢視視覺化視窗的尺寸 document.documentelement.clientwidth clientheight document.body.clientwidth...
JS 常用位置 和 尺寸 獲取 滑鼠的座標
innerwidth 文件顯示區域 寬 innerheight 文件顯示區域 高 outwidth 瀏覽器整個寬 outheight 瀏覽器整個高 screenx screenleft 瀏覽器裡螢幕左上角距離的x座標 screeny screentop 瀏覽器裡螢幕左上角距離的y座標 尺寸 elem...
元素的尺寸和位置
1 clientwidth clientheight 元素的可視部分的寬度和高度 也就是css的width加padding 它們不把邊框和滾動條計算在內，也不包括任何可能的滾動。若css中沒有指定元素的高度和寬度 即自適應 則ie中顯示0，而非ie瀏覽器則顯示實際的值 2 offsetwidth o...