獲取瀏覽器窗口的可視區域高度和寬度,滾動條高度有需要的朋友可參考一下。
1 document.body.clientWidth ==> BODY對象寬度
2 document.body.clientHeight ==> BODY對象高度 3 document.documentElement.clientWidth ==> 可見區域寬度 4 document.documentElement.clientHeight ==> 可見區域高度 5 6 document.body.clientWidth ==> 網頁可見區域寬 7 document.body.clientHeight ==> 網頁可見區域高 8 document.body.offsetWidth ==> 網頁可見區域寬(包括邊線的寬) 9 document.body.offsetHeight ==> 網頁可見區域高(包括邊線的高) 10 document.body.scrollWidth ==> 網頁正文全文寬document.body.scrollHeight ==> 網頁正文全文高 11 document.body.scrollTop ==> 網頁被卷去的高 12 document.body.scrollLeft ==> 網頁被卷去的左 13 window.screenTop ==> 網頁正文部分上 14 window.screenLeft ==> 網頁正文部分左 15 window.screen.height ==> 屏幕分辨率的高 16 window.screen.width ==> 屏幕可用工作區高度 17 window.screen.availHeight ==> 屏幕可用工作區高度 18 window.screen.availWidth ==> 屏幕可用工作區寬度
部分jquery函數獲取方法
1 // 部分jQuery函數 2 $(window).height() //瀏覽器時下窗口可視區域高度 3 $(document).height() //瀏覽器時下窗口文檔的高度 4 $(document.body).height() //瀏覽器時下窗口文檔body的高度 5 $(document.body).outerHeight(true) //瀏覽器時下窗口文檔body的總高度 包括border padding margin 6 $(window).width() //瀏覽器時下窗口可視區域寬度 7 $(document).width() //瀏覽器時下窗口文檔對於象寬度 8 $(document.body).width() //瀏覽器時下窗口文檔body的高度 9 $(document.body).outerWidth(true) //瀏覽器時下窗口文檔body的總寬度 包括border padding
1 HTML精確定位: scrollLeft,scrollWidth,clientWidth,offsetWidth 2 scrollHeight: 獲取對象的滾動高度。 3 scrollLeft: 設置或獲取位於對象左邊界和窗口中目前可見內容的最左端之間的距離 4 scrollTop: 設置或獲取位於對象最頂端和窗口中可見內容的最頂端之間的距離 5 scrollWidth: 獲取對象的滾動寬度 6 offsetHeight:獲取對象相對於版面或由父坐標 offsetParent 屬性指定的父坐標的高度 7 offsetLeft: 獲取對象相對於版面或由 offsetParent 屬性指定的父坐標的計算左側位置 8 offsetTop: 獲取對象相對於版面或由 offsetTop 屬性指定的父坐標的計算頂端位置 9 event.clientX 相對文檔的水平座標 10 event.clientY 相對文檔的垂直座標 11 event.offsetX 相對容器的水平坐標 12 event.offsetY 相對容器的垂直坐標 13 document.documentElement.scrollTop 垂直方向滾動的值 14 event.clientX+document.documentElement.scrollTop 相對文檔的水平座標+垂直方向滾動的量
alert($(document).scrollTop()); //獲取滾動條到頂部的垂直高度
alert($(document).scrollLeft()); //獲取滾動條到左邊的垂直寬度
