English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية
innerWidthLesbare Eigenschaft, die die Breite des Inhaltbereichs (Viewport) des Fensters zurückgibt, einschließlich der Scrollbalken.
VerwendungouterWidthEigenschaft, die die Breite des gesamten Browserfensters abruft.
window.innerWidth
var h = window.innerHeight; var w = window.innerWidth;Testen Sie heraus‹/›
Die in der Tabelle angegebenen Zahlen spezifizieren die erste Browser-Version, die den innerWidth-Eigenschaft vollständig unterstützt:
Eigenschaft | |||||
innerWidth | 1 | 1 | 9 | 3 | 9 |
Rückgabewert: | Eine Zahl, die die interne Breite des Inhaltbereichs des Browsers in Pixeln angibt |
---|
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‹/›
Fenster (Window) Referenz:window.innerHeight-Eigenschaft
Fenster (Window) Referenz:window.outerHeight-Eigenschaft
Fenster (Window) Referenz:window.outerWidth-Eigenschaft