使用javascript在宽屏幕上检测浏览器客户端区域大小 [英] Detecting browser client area size on wide screen using javascript

问题描述

我一直在使用以下代码检测浏览器客户端区域的宽度，并且它在所有浏览器中都占据了100％，包括FF，Safari和各种版本的IE。但是，现在当我切换到具有宽屏分辨率（1280x800）的新显示器时，此代码在IE8上失败。它报告1024的客户端宽度!!! ???

I've been using the following code to detect browser client area width for ages and it wokred 100% with all browsers, including FF, Safari and various versions of IE. However, now when I switched to a new monitor with widescreen resolution (1280x800) this code fails on IE8. It reports clientwidth of 1024 !!!???

任何想法如何获得正确的客户区宽度？

Any ideas how to get the correct client area width ?

function getClientWidth() {
  var v=0,d=document,w=window;
  if((!d.compatMode || d.compatMode == 'CSS1Compat') && !w.opera && d.documentElement && d.documentElement.clientWidth)
    {v=d.documentElement.clientWidth;}
  else if(d.body && d.body.clientWidth)
    {v=d.body.clientWidth;}
  else if(xDef(w.innerWidth,w.innerHeight,d.height)) {
    v=w.innerWidth;
    if(d.height>w.innerHeight) v-=16;
  }
  return v;
}

推荐答案

我使用的非jquery代码前段时间：

Non-jquery code I used some time ago:

function detectBrowserSize() {
    var myWidth = 0, myHeight = 0;
    if (typeof (window.innerWidth) == 'number') {
        //Non-IE
        myWidth = window.innerWidth;
        myHeight = window.innerHeight;
    } else if (document.documentElement && (document.documentElement.clientWidth ||   document.documentElement.clientHeight)) {
        //IE 6+ in 'standards compliant mode'
        myWidth = document.documentElement.clientWidth;
        myHeight = document.documentElement.clientHeight;
    } else if (document.body && (document.body.clientWidth || document.body.clientHeight)) {
        //IE 4 compatible
        myWidth = document.body.clientWidth;
        myHeight = document.body.clientHeight;
    }
    alert(myWidth + ' - ' + myHeight)
}

这篇关于使用javascript在宽屏幕上检测浏览器客户端区域大小的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！