在获取浏览器宽度的时候,许多时候需要考虑滚动条的存在。

一般情况作为前端获取浏览器宽度,主要是指获取body的宽度,可操作的可视范围宽度。

一、使用JQuery获取浏览器宽度
重点,jquery获取的宽度=浏览器的可视宽度-滚动条的宽度(如果有滚动条)

//JQuery 获取浏览器宽度 :浏览器的可视宽度-滚动条的宽度(如果出现垂直方向滚动条)
var winWidth = $(window).width();

二、使用Js 获取浏览器宽度

● window.outerWidth: 浏览器宽度,包含了浏览器边框所以这种方式不常用。
● window.outerHeight: 浏览器高度
● window.innerWidth: 浏览器内页面可用宽度,此宽度包含了垂直滚动条的宽度(若存在)。
● window.innerHeight: 浏览器内页面可用高度,此高度包含了水平滚动条的高度(若存在)。

从window.resize 事件中获取浏览器宽度:

        $(window).resize(function (e) {
            //var innerWidth = e.currentTarget.innerWidth;
            var innerWidth = window.innerWidth;
           
声明:本站所有文章,如无特殊说明或标注,均为本站原创发布。任何个人或组织,在未征得本站同意时,禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益,可联系我们进行处理。