Categories
JavaScript Answers

How to get the browser width and height after user resizes the window with JavaScript?

Spread the love

Sometimes, we want to get the browser width and height after user resizes the window with JavaScript.

In this article, we’ll look at how to get the browser width and height after user resizes the window with JavaScript.

How to get the browser width and height after user resizes the window with JavaScript?

To get the browser width and height after user resizes the window with JavaScript, we can get the clientWidth and clientHeight properties from the window resize event handler.

For instance, we write:

window.onresize = () => {
  const {
    clientWidth,
    clientHeight
  } = document.body;
  console.log(clientWidth, clientHeight)
}

We set window.onresize to a function that gets the width and height of the body element with:

const {
  clientWidth,
  clientHeight
} = document.body;

Now when we resize the window, we should see the values logged.

Conclusion

To get the browser width and height after user resizes the window with JavaScript, we can get the clientWidth and clientHeight properties from the window resize event handler.

By John Au-Yeung

Web developer specializing in React, Vue, and front end development.

Leave a Reply

Your email address will not be published. Required fields are marked *