获取窗口属性/浏览器视口尺寸

Posted hmd180324

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了获取窗口属性/浏览器视口尺寸相关的知识,希望对你有一定的参考价值。

技术分享图片

技术分享图片

 

技术分享图片技术分享图片

技术分享图片

解决办法:相加(IE8以及以下浏览器)

技术分享图片

 

 封装兼容性方法,可以实时返回滚动条滚动距离getScrollOffset():

 

技术分享图片
<script type="text/javascript">
        function getScrollOffset() {
            if(window.pageXoffset) {
                return {
                    x : window.pageXoffset,
                    y : window.pageYoffset
                }
            }else {
                return {
                    x : document.body.scrollLeft + document.documentElement.scrollLeft,
                    y : document.body.scrollTop + document.documentElement.scrollTop
                }
            }
        }

    </script>
    
View Code

 技术分享图片

技术分享图片

技术分享图片

 封装兼容性方法,返回浏览器视口尺寸:

技术分享图片

 

以上是关于获取窗口属性/浏览器视口尺寸的主要内容,如果未能解决你的问题,请参考以下文章

获取浏览器高度 窗口高度 元素尺寸 偏移属性

记录美好一天

定位和布局

响应式网站应设置的视口(viewPort)

GPU如何渲染到正确的窗口?

浏览器窗口可视区域大小