Window.innerWidth

 The read-only Window property innerWidth returns the interior width of the window in pixels. This includes the width of the vertical scroll bar, if one is present.


More precisely, innerWidth returns the width of the window's layout viewport. The interior height of the window—the height of the layout viewport—can be obtained from the innerHeight property.


Value

An integer value indicating the width of the window's layout viewport in pixels. This property is read-only, and has no default value.


To change the window's width, use one of the Window methods for resizing windows, such as resizeBy() or resizeTo().


<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>ye</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<p>Resize the browser window to fire the <code>resize</code> event.</p>
<p>Window height: <span id="height"></span></p>
<p>Window width: <span id="width"></span></p>
<script src="script.js"></script>
</body>
</html>
const heightOutput = document.querySelector("#height");
const widthOutput = document.querySelector("#width");
function resizeListener() {
heightOutput.textContent = window.innerHeight;
widthOutput.textContent = window.innerWidth;
}
window.addEventListener("resize", resizeListener);

Comments

Popular posts from this blog

Two Sum II - Input Array Is Sorted

Comparable Vs. Comparator in Java

Increasing Triplet Subsequence