首頁  >  文章  >  web前端  >  JS和JQUERY取得頁面大小,捲軸位置,元素位置(範例程式碼)_jquery

JS和JQUERY取得頁面大小,捲軸位置,元素位置(範例程式碼)_jquery

WBOY
WBOY原創
2016-05-16 17:09:04888瀏覽

js與jquery獲得頁面大小、滾動條位置、元素位置

複製代碼 代碼如下:

//頁面位置及視窗大小

function GetPageSize() {
var scrW, scrH;
if(window.innerHeight && window.scrollMaxY)
{    // Mozilla .Maxo Maxoo>Maxooo.Fdow -Ft. >scrH = window.innerHeight window.scrollMaxY;
}
else if(document.body.scrollHeight > document.body.offsetHeight)
{    // all 調整 IE Mac p. .scrollWidth;   
scrH = document.body.scrollHeight;
} else if(document.body)
{ // IE Mac   關於🎜>scrW = document.body.com .body.offsetHeight;
}
var winW, winH;
if(window.innerHeight)
{ // all except IE   
winW = window.innerWidths } else if (document.documentElement && document.documentElement.clientHeight)
{    // IE 6 Strict Mode   . entElement. clientHeight;
} else if (document.body) { // other   
winW = document.body.clientWidth;   
winH = document.body. forHeight; size less then the viewport
var pageW = (scrWvar pageH = (scrHreturn {HageW:page, Page, WinW:winW, WinH:winH};

};



//捲軸位置


function GetPageScroll()

{

var x / all except IE   

y = window.pageYOffset;   

x = window.pageXOffset; } else if(遠聲🎜 >y = document.documentElement.scrollTop;    x = document.documentElement.scrollLeft;
} else if(document.body) {    >x = document.body.scrollLeft;  
}
return {X:x, Y:y};

}




jquery



取得瀏覽器顯示區域的高度: $(window).height();
取得瀏覽器顯示區域的寬度:$(window).width();
取得頁面的文件高度:$ (document).height();
取得頁面的文檔寬度:$(document).width();

取得滾動條到頂部的垂直高度 :$(document).scrollTop();
取得捲軸到左邊的垂直寬度 :$(document).scrollLeft();


計算元素位置和偏移量 offset方法是一個很有用的方法,它會傳回包裝集中第一個元素的偏移資訊。預設是相對body的偏移資訊。結果包含 top和left兩個屬性。 offset(options, results) options.relativeTo  指定相對計 算偏移位置的祖先元素。這個元素應該是relative或absolute定位。省略則相對body。

options.scroll  是否把捲軸計算在內,預設TRUE
options.padding  是否把padding計算在內,預設false
options.margin   是否把margintion .border  是否把邊框計算在內,預設true

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn