站長資訊網
jquery求屏幕高度的方法：1、通過“alert($(window).height());”方法獲取瀏覽器當前窗口可視區(qū)域高度；2、通過“alert($(document).height());”方法獲取瀏覽器當前窗口文檔的高度；3、通過“alert($(document.body).height());”方法獲取瀏覽器當前窗口文檔body的高度等。
本教程操作環(huán)境：Windows10系統(tǒng)、jquery3.2.1版、DELL G3電腦
jquery怎么求屏幕的高度？
js或jQuery獲取當前屏幕的各種高度
一、參考地址：
js或jQuery獲取當前屏幕的各種高度
jquery監(jiān)控瀏覽窗口尺寸變化執(zhí)行相應的代碼
二、
1、Javascript:
網頁可見區(qū)域寬： document.body.clientWidth 網頁可見區(qū)域高： document.body.clientHeight 網頁可見區(qū)域寬： document.body.offsetWidth (包括邊線的寬) 網頁可見區(qū)域高： document.body.offsetHeight (包括邊線的高) 網頁正文全文寬： document.body.scrollWidth 網頁正文全文高： document.body.scrollHeight 網頁被卷去的高： document.body.scrollTop 網頁被卷去的左： document.body.scrollLeft 網頁正文部分上： window.screenTop 網頁正文部分左： window.screenLeft 屏幕分辨率的高： window.screen.height 屏幕分辨率的寬： window.screen.width 屏幕可用工作區(qū)高度： window.screen.availHeight 屏幕可用工作區(qū)寬度： window.screen.availWidth
登錄后復制
2、JQuery:
$(document).ready(function(){ alert($(window).height()); //瀏覽器當前窗口可視區(qū)域高度 alert($(document).height()); //瀏覽器當前窗口文檔的高度 alert($(document.body).height());//瀏覽器當前窗口文檔body的高度 alert($(document.body).outerHeight(true));//瀏覽器當前窗口文檔body的總高度 包括border padding margin alert($(window).width()); //瀏覽器當前窗口可視區(qū)域寬度 alert($(document).width());//瀏覽器當前窗口文檔對象寬度 alert($(document.body).width());//瀏覽器當前窗口文檔body的寬度 alert($(document.body).outerWidth(true));//瀏覽器當前窗口文檔body的總寬度 包括border padding margin })
登錄后復制
三、窗口大小改變時
$(window).resize(function(){ //執(zhí)行代碼塊 });
登錄后復制
四、點擊返回頂部
$('.go_top').click(function(){ if ($(window).scrollTop() > 0) { $("html,body").stop().animate({ scrollTop: 0 }, 200); } }); $(window).scroll(function(){ var w_h = $(document).scrollTop(); if(w_h>300){ $('.go_top').fadeIn(); } if(w_h<=300){ $('.go_top').fadeOut(); } });
登錄后復制
推薦學習：《jQuery視頻教程》
