Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

JavaScript: How to find out width and height of viewpoint in browser window?

Tags:

javascript

How to find out width and height of viewpoint in browser window? And How to find out how much document scrolled to down and to right?

like image 656
xXx Avatar asked Dec 07 '09 15:12

xXx


People also ask

How do I find my browser viewport size?

You can use the window. innerHeight property to get the viewport height, and the window. innerWidth to get its width. let viewportHeight = window.

How do I find my browser width and height?

Use window. innerWidth and window. innerHeight to get the current screen size of a page.

How do you calculate VH in JavaScript?

Now let's get the inner height of the viewport in JavaScript: // First we get the viewport height and we multiple it by 1% to get a value for a vh unit let vh = window. innerHeight * 0.01; // Then we set the value in the --vh custom property to the root of the document document.

How do you find the width of a DOM element?

Use offsetWidth & offsetHeight properties of the DOM element to get its the width and height.


1 Answers

Try this function... and call it when needed :)

function getViewPortSize()
{
    var viewportwidth;
    var viewportheight;

    //Standards compliant browsers (mozilla/netscape/opera/IE7)
    if (typeof window.innerWidth != 'undefined')
    {
        viewportwidth = window.innerWidth,
        viewportheight = window.innerHeight
    }

    // IE6
    else if (typeof document.documentElement != 'undefined'
    && typeof document.documentElement.clientWidth !=
    'undefined' && document.documentElement.clientWidth != 0)
    {
        viewportwidth = document.documentElement.clientWidth,
        viewportheight = document.documentElement.clientHeight
    }

    //Older IE
    else
    {
        viewportwidth = document.getElementsByTagName('body')[0].clientWidth,
        viewportheight = document.getElementsByTagName('body')[0].clientHeight
    }

    return viewportwidth + "~" + viewportheight;
}
like image 52
Juanra Avatar answered Oct 03 '22 22:10

Juanra