关于跨平台browser窗口大小的问题

最近看到一篇文章，是讲浏览器的。其中有一点是讲窗口大小的，我感觉很好，我这里也分析一下

窗口大小：

跨浏览器确定一个窗口的大小不是一个简单的事。IE9，FF，safari，Opera，Chrome均为此提供了4个属性：innerWidth，innerHeight，outerWidth，outerHeight

在IE9 safari和FF中，outerwidth和outerHeight 返回浏览器窗口本身的尺寸。但在Opera中，这两个属性的值却表示页面的视图容器的大小，也就是viewport的大小，很奇怪的是

innerWidth和innerHeight则表示该容器中页面视图区的大小。在Chrome这两点都返回同样的值，即viewport的大小。

那么确定窗口的大小就是一点很难的事情了。那么怎么办呢？

在IE，ff，Opera，Chrome，safari中，document.documentElement.clientWidth和docuemnt.documentElement.clientHeight中保存了视图页面的视口的消息。但在IE6中，

这些属性必须是标准模式下才有效，如果是混杂模式，就必须通过document.body.clientWidth和document.body.cilentHeight取得相同信息。而对于混杂模式下的Chrome，则无论通过

document.documentElement，还是document.body中的clientWidth和clientHeight属性，都可以取得视窗的大小。

下面提供跨平台的代码

Js代码

var pageWidth = window.innerWidth,

pageHeight = window.innerHeight;

if(typeof pagewidth != "number"){

if(document.compartMode == "CSS1Compat"){

pageWidth = document.documentElement.clientWidth;

pageHeight = document.docuemntElement.clientHeight;

}else{

pageWidth = document.body.clientWidht;

pageHeight = document.body.clientHeight;

}

}