Определение размеров видимой части страницы

Веб-разработчики довольно часто сталкиваются с необходимостью определить, что поместится на экране пользователя, другими словами, определить размеры видимой части страницы сайта.

Размер видимой части страницы – это ширина и высота области просмотра окна браузера без учета полос прокрутки, дополнительных полей и границ.

Единого метода опредения этих размеров пока нет. Поэтому предлагаю вашему вниманию две функции, которые выполнят задачу в любом браузере.

Исходный код этого примера:

<script>
    function windowWidth(){
        if(window.visualViewport && window.visualViewport.width) return window.visualViewport.width;
        var de=document.documentElement;
        return self.innerWidth || ( de && de.clientWidth ) || document.body.clientWidth;
    }
    function windowHeight(){
        if(window.visualViewport && window.visualViewport.height) return window.visualViewport.height;
        var de=document.documentElement;
        return self.innerHeight || ( de && de.clientHeight) || document.body.clientHeight;
    }
    document.write("<h3>Размер окна просмотра: "+windowWidth()+" x "+windowHeight()+"</h3>");

</script>