Comment trouver la hauteur de l'écran dans jquery

Comment trouver la hauteur de l'écran avec jquery : 1. Obtenez la hauteur de la zone visible de la fenêtre actuelle du navigateur via la méthode "alert($(window).height());" alert($(document).height() ));" méthode pour obtenir la hauteur du document dans la fenêtre actuelle du navigateur; 3. Obtenez la hauteur du corps du document dans la fenêtre actuelle du navigateur via la méthode "alert ($(document.body).height());" méthode, etc.

L'environnement d'exploitation de ce tutoriel : système Windows 10, jquery version 3.2.1, ordinateur DELL G3

Comment trouver la hauteur de l'écran avec jquery ?

js ou jQuery pour obtenir les différentes hauteurs de l'écran actuel

1. Adresse de référence :

js ou jQuery pour obtenir les différentes hauteurs de l'écran actuel

jquery surveille le changement de taille de la fenêtre de navigation et exécute le code correspondant

2.

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
})

3. Lorsque la taille de la fenêtre change

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

4. Cliquez pour revenir en haut

$('.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();
    }
});

Apprentissage recommandé : "Tutoriel vidéo jQuery"

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!