Heim > Artikel > Web-Frontend > js/jquery ruft die Höhe und Breite des sichtbaren Bereichs des Browserfensters sowie den Implementierungscode für die Höhe der Bildlaufleiste ab
Ermitteln Sie die Höhe und Breite des sichtbaren Bereichs des Browserfensters. Freunde, die die Höhe der Bildlaufleiste benötigen, können darauf verweisen.
Im IE kann die Größe des Browser-Anzeigefensters nur wie folgt ermittelt werden: Kopieren Sie den Code wie folgt:
document.body.offsetWidth document.body.offsetHeight
In Browsern, die DOCTYPE deklarieren, können Sie Folgendes verwenden, um die Größe des Browser-Anzeigefensters zu ermitteln : Code Kopieren Sie den Code wie folgt
document.documentElement.clientWidth document.documentElement.clientHeight
IE, FF und Safari unterstützen alle diese Methode. Obwohl Opera dieses Attribut unterstützt, gibt es gleichzeitig die Seitengröße zurück, außer IE verwendet diese Methode. Die Informationen werden im Fensterobjekt gespeichert und können mit dem folgenden Code abgerufen werden: Kopieren Sie den Code wie folgt:
window.innerWidth window.innerHeightErmitteln Sie im Allgemeinen die Größe der gesamten Webseite. Kopieren Sie den Code wie folgt
document.body.scrollWidth document.body.scrollHeightDie Bildschirmauflösung und -höhe werden im Allgemeinen ermittelt. Der Methodencode lautet wie folgt. Kopieren Sie den Code
window.screen.height window.screen.widthUm das Beispiel zusammenzufassen
function getViewSizeWithoutScrollbar(){//不包含滚动条 return { width : document.documentElement.clientWidth, height: document.documentElement.clientHeight } } function getViewSizeWithScrollbar(){//包含滚动条 if(window.innerWidth){ return { width : window.innerWidth, height: window.innerHeight } }else if(document.documentElement.offsetWidth == document.documentElement.clientWidth){ return { width : document.documentElement.offsetWidth, height: document.documentElement.offsetHeight } }else{ return { width : document.documentElement.clientWidth + getScrollWith(), height: document.documentElement.clientHeight + getScrollWith() } } }Die Unterschiede zwischen IE und Firefox lauten wie folgt:
IE6.0, FF1.06+:
clientWidth = width + padding clientHeight = height + padding offsetWidth = width + padding + border offsetHeight = height + padding + border IE5.0/5.5: clientWidth = width - border clientHeight = height - border offsetWidth = width offsetHeight = heightAngehängt ist die am häufigsten verwendete Methode zum Ermitteln der Breite und Höhe der gesamten Seite (erfordert ein JQuery-Framework). . Kopieren Sie den Code wie folgt
$(document).width() < $('body').width() ? $(document).width() : $('body').width(); $(document).height() < $('body').height() ? $(document).height() : $('body').height();alert($(window).height()); //Browser Die Höhe des aktuell sichtbaren Bereichs des Fensters
alert($(document ).height()); //Die Höhe des aktuellen Fensterdokuments des Browsers
alert($(document.body).height());//Browse Die Höhe des aktuellen Fensterdokumentkörpers im Browser
alert($(document.body).outerHeight(true));//Die Gesamthöhe des aktuellen Fensterdokumentkörpers im Browser umfasst den Randpolsterungsrand
alert($(window). width()) ; //Die aktuelle Breite des sichtbaren Fensterbereichs des Browsers
alert($(document).width());//Die aktuelle Breite des Fensterdokumentobjekts des Browsers
alert($(document.body) ).width() );//Die Höhe des Dokumentkörpers des aktuellen Fensters des Browsers
alert($(document.body).outerWidth(true));//Die Gesamtbreite des Dokumentkörpers des aktuellen Fensters des Browsers umfasst den Randpolsterungsrand
alert($(document).scrollTop()); //Ermittelt die vertikale Höhe der Bildlaufleiste nach oben
alert($(document).scrollLeft()); //Ermittelt die Bildlaufleiste nach oben links Die vertikale Breite