English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية

Window innerWidth Eigenschaft

JavaScript Window-Objekt

innerWidthLesbare Eigenschaft, die die Breite des Inhaltbereichs (Viewport) des Fensters zurückgibt, einschließlich der Scrollbalken.

VerwendungouterWidthEigenschaft, die die Breite des gesamten Browserfensters abruft.

Syntax:

window.innerWidth
var h = window.innerHeight;
var w = window.innerWidth;
Testen Sie heraus‹/›

Browser-Kompatibilität

Die in der Tabelle angegebenen Zahlen spezifizieren die erste Browser-Version, die den innerWidth-Eigenschaft vollständig unterstützt:

Eigenschaft
innerWidth11939

Technische Details

Rückgabewert:Eine Zahl, die die interne Breite des Inhaltbereichs des Browsers in Pixeln angibt

Mehr Beispiele

Verwenden Sie das onresize-Ereignis, um Breite und Höhe anzuzeigen:

<body onresize="myFunc()">
<script>
function myFunc() {
   var w = window.innerWidth;
   var h = window.innerHeight;
   document.getElementById("para").innerHTML = "Width: " + w + "<br>Height: " + h;
}
</script>
Testen Sie heraus‹/›

Cross-Browser-Lösung (für IE8und früheren Versionen, die clientWidth und clientHeight verwenden):

var h = window.innerHeight
|| document.documentElement.clientHeight
|| document.body.clientHeight;
var w = window.innerWidth
|| document.documentElement.clientWidth
|| document.body.clientWidth;
Testen Sie heraus‹/›

Dieser Beispiel zeigt innerWidth, innerHeight, outerWidth und outerHeight in einem Beispiel an:

var txt = "";
txt += "<p>innerWidth: " + window.innerWidth + "</p>";
txt += "<p>innerHeight: " + window.innerHeight + "</p>";
txt += "<p>outerWidth: " + window.outerWidth + "</p>";
txt += "<p>outerHeight: " + window.outerHeight + "</p>";
document.write(txt);
Testen Sie heraus‹/›

Zusammenhängende Referenzen

Fenster (Window) Referenz:window.innerHeight-Eigenschaft

Fenster (Window) Referenz:window.outerHeight-Eigenschaft

Fenster (Window) Referenz:window.outerWidth-Eigenschaft

JavaScript Window-Objekt