
There are two methods to get the viewport width: window.innerWidth
and document.documentElement.clientWidth
. The former is more accurate. The latter has better browser support.
To get the best of both worlds, try innerWidth
first, and fallback to clientWidth
if not supported.
var viewportWidth = window.innerWidth || document.documentElement.clientWidth;
Source
https://vanillajstoolkit.com/reference/viewport/viewport-width/