0

I'm not talking about getting a rounded size, I need to get the fractional one.

An only way I know is to create a new div element with the position: fixed; top: 0; right: 0, bottom: 0, left: 0 properties set and append it to the body element after it's done, I can get a fractional size with getBoundingClientRect.

But it's slow, it's very slow. This approach stops the rest JS code from being executed until the DOM manipulations and calculations are done.

Is there a way of doing this without an expensive approach?

Katya
  • 11
  • 3
  • 1
    Does this answer your question? [How to get the browser viewport dimensions?](https://stackoverflow.com/questions/1248081/how-to-get-the-browser-viewport-dimensions) – M.A Shahbazi Oct 11 '20 at 09:06
  • In CSS you can use `vw` (viewport width) and `vh` (viewport height). For example `80vw` is 80% of the viewport's width. – Titus Oct 11 '20 at 09:08
  • @M.AShahbazi I'm not sure because I need `fractional` values! – Katya Oct 11 '20 at 09:11

1 Answers1

0

You could try using

let viewPortHeight = window.innerHeight;
edddd
  • 433
  • 3
  • 17
  • Sorry! Could I ask you a question!? Have you read my post? – Katya Oct 11 '20 at 09:12
  • @Katya please give me an example of what a 'fractional' value might look like – edddd Oct 11 '20 at 09:14
  • 50.52 is fractional. 51 is rounded – Katya Oct 11 '20 at 09:16
  • @Katya what unit do you need this as? 50.52 px? 50.52 cm? 50.52%? – edddd Oct 11 '20 at 09:19
  • @Katya well a pixel cannot be cut in half physically, so I'm convinced there can't be a viewport height that's not an integer. So when `window.innerHeight` returns something like `52`, it's probably the precise value, not rounded. – edddd Oct 11 '20 at 09:26
  • Trust me, it can be!!! Did you hear something about `pixelRatio`, `scaling`, `4k monitors`. In fact, this list can be longer. It seems to me I've found a solution to my question, but I need to test it and if it works correctly. I give my answer here. – Katya Oct 11 '20 at 09:36