如何在没有滚动条宽度和高度的情况下获取浏览器窗口大小?
当我使用这种方法时,我正在使用滚动条的宽度和高度来提出34.
- var $windowW = ($(window).width() - 34);
- var $windowH = ($(window).height() - 34);
- alert($windowW + " " + $windowH); // THe results are width 1440 and 745 height
- $("body").css("width",$windowW);
- $("body").css("height",$windowH);
- $("body").css("border","1px solid green");
解决方法
- function getScrollBarDimensions(){
- var elm = document.documentElement.offsetHeight ? document.documentElement : document.body,curX = elm.clientWidth,curY = elm.clientHeight,hasScrollX = elm.scrollWidth > curX,hasScrollY = elm.scrollHeight > curY,prev = elm.style.overflow,r = {
- vertical: 0,horizontal: 0
- };
- if( !hasScrollY && !hasScrollX ) {
- return r;
- }
- elm.style.overflow = "hidden";
- if( hasScrollY ) {
- r.vertical = elm.clientWidth - curX;
- }
- if( hasScrollX ) {
- r.horizontal = elm.clientHeight - curY;
- }
- elm.style.overflow = prev;
- return r;
- }
运行getScrollBarDimensions();在这个页面上产生:
- Object
- horizontal: 0
- vertical: 17
对我来说,谷歌浏览器,IE7,歌剧和Firefox.