jquery – 如何在没有滚动条的情况下获取浏览器窗口大小

前端之家收集整理的这篇文章主要介绍了jquery – 如何在没有滚动条的情况下获取浏览器窗口大小前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
如何在没有滚动条宽度和高度的情况下获取浏览器窗口大小?

当我使用这种方法时,我正在使用滚动条的宽度和高度来提出34.

  1. var $windowW = ($(window).width() - 34);
  2. var $windowH = ($(window).height() - 34);
  3. alert($windowW + " " + $windowH); // THe results are width 1440 and 745 height
  4. $("body").css("width",$windowW);
  5. $("body").css("height",$windowH);
  6. $("body").css("border","1px solid green");

解决方法

  1. function getScrollBarDimensions(){
  2. 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 = {
  3. vertical: 0,horizontal: 0
  4. };
  5.  
  6.  
  7. if( !hasScrollY && !hasScrollX ) {
  8. return r;
  9. }
  10.  
  11. elm.style.overflow = "hidden";
  12.  
  13. if( hasScrollY ) {
  14. r.vertical = elm.clientWidth - curX;
  15. }
  16.  
  17. if( hasScrollX ) {
  18. r.horizontal = elm.clientHeight - curY;
  19. }
  20. elm.style.overflow = prev;
  21.  
  22.  
  23. return r;
  24. }

运行getScrollBarDimensions();在这个页面上产生:

  1. Object
  2. horizontal: 0
  3. vertical: 17

对我来说,谷歌浏览器,IE7,歌剧和Firefox.

猜你在找的jQuery相关文章