瀏覽器視口大小、HTML元素偏移量的獲取
阿新 • • 發佈:2019-02-14
獲取瀏覽器(<html>/<body>)視口大小
這個函式首先檢查document.compatMode屬性,確定瀏覽器是否執行在混雜模式。大多數瀏覽器都執行在標準模式下,所以會自動執行else程式碼。
function getViewport() { if (document.compatMode == "BackCompat") { return { width: document.body.clientWidth, height: document.body.clientHeight } } else { return { width: document.documentElement.clientWidth, height: document.documentElement.clientHeight } } }
獲取元素偏移量
下面函式可以準確獲得元素相對於document的(左)偏移量,如果想得到上偏移量,只需將程式碼中所有的offsetLeft替換為offsetTop即可。
function getElementLeft (element) { var actualLeft = element.offsetLeft; var current = element.offsetParent; while (current !== null) { actualLeft += current.offsetLeft; current = current.offsetParent; } return actualLeft; }