[browser window窗口大小 算是screen补充吧]主要因为移动IE游览器 写了个兼容
先上图吧

来上代码
console.log(window.outerWidth + '--' + window.outerHeight);//只读的整数,声明了整个窗口的XY
//IE 不支持此属性,且没有提供替代的属性。
var width = window.innerWidth;
var height = window.innerHeight;
console.log("window.inner--" + width+ '--' + height);
console.log('-------------');
var width = document.documentElement.clientWidth;
var height = document.documentElement.clientHeight;
console.log("document.documentElement.client--" + width + '--' + height);
console.log('-------------');
var width = document.body.clientWidth;
var height = document.body.clientHeight;
console.log("document.body.client--" + width + '--' + height);
console.log('-------------');
console.log(document.compatMode);//兼容模式是否开启
//开启CSS1Compat 否backCompat
写了个获得移动设备的windowXY JS高设3 P198-199
//获得window的大小,主要因为在移动设备IE游览器上有区别
//移动IE游览器不支持inner client
//可以通过document.documentElement.client获得
//compatMode判断兼容模式是否开启
function windowClientXY(){
var pageWidth = window.innerWidth;
var pageHeight = window.innerHeight;
if(typeof pageWidth != 'number'){
if(document.compatMode == 'CSS1Compat'){
pageWidth = document.documentElement.clientWidth;
pageHeight = document.documentElement.clientHeight;
}else{
pageWidth = document.body.clientWidth;
pageHeight = document.body.clientHeight;
}
}
return console.log("宽-" + pageWidth + ",高-" +pageHeight);
}
windowClientXY(); //分别封装
function windowClientX(){
var pageWidth = window.innerWidth;
if(typeof pageWidth != 'number'){
if(document.compatMode == 'CSS1Compat'){
pageWidth = document.documentElement.clientWidth;
}else{
pageWidth = document.body.clientWidth;
}
}
return windowClientX = pageWidth
}
console.log(windowClientX()); function windowClientY(){
var pageHeight = window.innerHeight;
if(typeof pageWidth != 'number'){
if(document.compatMode == 'CSS1Compat'){
pageHeight = document.documentElement.clientHeight;
}else{
pageHeight = document.body.clientHeight;
}
}
return windowClientY = pageHeight
}
console.log(windowClientY());
[browser window窗口大小 算是screen补充吧]主要因为移动IE游览器 写了个兼容的更多相关文章
- Embedding Flash Fullscreen in the Browser Window
For Developers > Design Documents > Embedding Flash Fullscreen in the Browser Window Auth ...
- Centering window on the screen
The following script shows how we can center a window on the desktop screen. #!/usr/bin/python # -*- ...
- UI Framework-1: Browser Window
Browser Window The Chromium browser window is represented by several objects, some of which are incl ...
- Personalize Oracle Applications Home Page Browser Window Title
修改登录页 http://expertoracle.com/2016/03/10/personalizing-the-e-business-suite-r12-login-page/ STEP 2 : ...
- [browser navigator],写了个检测游览器版本
前些天胃不舒服打吊针了,真得准时吃饭各种啊,然后就是懒,就没在复习了,这次复习的内容是navigator //未知效果 // console.log('浏览器的次要版本' + navigator.ap ...
- 《JAVASCRIPT高级程序设计》window/location/navigator/screen/history对象
如果要在web中使用JAVASCRIPT,那么BOM(浏览器对象模型)毫无疑问是最重要的部分.BOM提供了很多对象,例如,window.location.navigator.screen.histor ...
- JS BOM基础 全局对象 window location history screen navigator
全局变量声明的两种方式:1,window.变量名=值;2,var 变量名=值; 全局函数声明的两种方式:1,window.函数名=function(){}2,function 函数名=function ...
- 获取window窗口大小
窗口大小 跨浏览器确定一个窗口的大小不是一件简单的事.IE9+.Firefox.Safari.Opera和Chrome均为此提供了4个属性:innerWidth.innerHeight.outerWi ...
- Browser Window
Window 对象 Window对象表示浏览器中打开的窗口. 如果文档包含框架(iframe或iframe标签),浏览器会被html文档创建一个window对象,并为每个框架创建一个额外的window ...
随机推荐
- WinForm自定义控件之DefaultValue的误解
DefaultValue,顾名思义,默认值的意思.但这个默认值不是用来显示的,它的作用是当属性设置的值(无法代码写还是属性窗口输入)与DefaultValue相同时,会区别显示,比如其它值加粗,Def ...
- 网易极客战记官方攻略-地牢-Kithgard 地牢
关卡连接: https://codecombat.163.com/play/level/dungeons-of-kithgard 夺取宝石,逃出地牢--注意不要触碰其他东西.在这个关卡里,你会学习编写 ...
- Flutter学习笔记(28)--使用第三方jar包
如需转载,请注明出处:Flutter学习笔记(28)--使用第三方jar包 1.打开一个Flutter项目,点击编码窗口右上角的Open for Editing in Android Studio,这 ...
- SQL Server 2012 官方版 / SQL Server 2012下载
SQL Server是微软的一款专业免费的关系数据库管理工具, 是一个全面的数据库平台,使用集成的商业智能 (BI)工具提供了企业级的数据管理服务,SQL Server 数据库引擎为关系型数据和结构化 ...
- js数组对象过滤——filter,find,some,every
1.filter() 方法创建一个新的数组,新数组中的元素是通过检查指定数组中符合条件的所有元素. 原数组不变 不会对空数组进行检测 let arr1 = [1,2,3,4] let ...
- English:Day-to-day 1015
device session stroll pants & trousers gist deep depth diameter D radius R merge ..
- 卡拉OK歌词原理和实现高仿Android网易云音乐
大家好,我们是爱学啊,继上一篇讲解了[LRC歌词原理和实现高仿Android网易云音乐],今天给大家带来一篇关于卡拉OK歌词原理和在Android上如何实现歌词逐字滚动的效果,本文来自[Android ...
- RabbitMQ Win10安装
RabbitMQ是消息对列,主要是用于做消息代理.本质上说,它接受来自生产者的信息,并将它们传递给消费者.在两者之间, 它可以根据你给它的路由,缓冲规则有选择地进行传递消息.采用Erlang语言开 ...
- Spring Security安全框架
今天来简单介绍一下Spring Security安全框架 简介 Spring Security 提供了基于javaEE的企业应有个你软件全面的安全服务.这里特别强调支持使用SPring框架构件的项目, ...
- Redis基础类型常用操作命令
Redis基础类型常用操作命令 概念:Redis是用C语言开发的一个开源的高性能键值对数据库. 特征: 数据间没有必然的联系 内部采用单线程机制进行工作 高性能 多数据类型支持 字符串类型 Strin ...