jquery怎麼求螢幕的高度

jquery求螢幕高度的方法：1、透過「alert($(window).height());」方法取得瀏覽器目前視窗可視區域高度；2、透過「alert($(document ).height());”方法取得瀏覽器目前視窗文件的高度；3、透過「alert($(document.body).height());」方法取得瀏覽器目前視窗文件body的高度等。

本教學操作環境：Windows10系統、jquery3.2.1版、DELL G3電腦

jquery怎麼求螢幕的高度？

js或jQuery取得目前畫面的各種高度

#一、參考位址：

js或jQuery取得目前畫面的各種高度

jquery監控瀏覽視窗尺寸變化執行對應的程式碼

 

二、

    1、Javascript:

网页可见区域宽： document.body.clientWidth
网页可见区域高： document.body.clientHeight
网页可见区域宽： document.body.offsetWidth (包括边线的宽)
网页可见区域高： 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
屏幕可用工作区高度： window.screen.availHeight
屏幕可用工作区宽度： window.screen.availWidth

    2 、JQuery:

$(document).ready(function(){
alert($(window).height()); //浏览器当前窗口可视区域高度
alert($(document).height()); //浏览器当前窗口文档的高度
alert($(document.body).height());//浏览器当前窗口文档body的高度
alert($(document.body).outerHeight(true));//浏览器当前窗口文档body的总高度 包括border padding margin
alert($(window).width()); //浏览器当前窗口可视区域宽度
alert($(document).width());//浏览器当前窗口文档对象宽度
alert($(document.body).width());//浏览器当前窗口文档body的宽度
alert($(document.body).outerWidth(true));//浏览器当前窗口文档body的总宽度 包括border padding margin
})

 

三、視窗大小改變時

$(window).resize(function(){
   //执行代码块
});

 

四、點選返回頂部

$('.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){
        $(&#39;.go_top&#39;).fadeOut();
    }
});

推薦學習： 《jQuery影片教學》

以上是jquery怎麼求螢幕的高度的詳細內容。更多資訊請關注PHP中文網其他相關文章！