获取游览器窗口的大小(window对象)
来源:互联网 发布:淘宝刚开店怎么做 编辑:程序博客网 时间:2024/06/05 01:20
window对象获取游览器窗口大小
window获取窗口的大小在不同浏览器上情况不一样,根据主流的浏览器大致分为以下三种情况。
注意:浏览器的视口不包括<工具栏>和<滚动条>
情况一:
在Internet Explorer(9+)、Chrome、Firefox、Opera 以及 Safari:
window.innerHeight - 浏览器窗口的内部高度
window.innerWidth - 浏览器窗口的内部宽度
示例代码:
document.documentElement.clientHeight
document.documentElement.clientWidth
示例代码:
情况三:
window获取窗口的大小在不同浏览器上情况不一样,根据主流的浏览器大致分为以下三种情况。
注意:浏览器的视口不包括<工具栏>和<滚动条>
情况一:
在Internet Explorer(9+)、Chrome、Firefox、Opera 以及 Safari:
window.innerHeight - 浏览器窗口的内部高度
window.innerWidth - 浏览器窗口的内部宽度
示例代码:
<script type="text/javascript"> var width = window.innerWidth; var height = window.innerHeight ; console.log("窗口宽度:"+width); console.log("窗口高度:"+height);</script>
情况二:
document.documentElement.clientHeight
document.documentElement.clientWidth
示例代码:
<script type="text/javascript"> var width = document.documentElement.clientWidth; var height = document.documentElement.clientHeight; console.log("窗口宽度:"+width); console.log("窗口高度:"+height);</script>
情况三:
为了兼容浏览器的版本可以使用下面的代码(可以涵盖所有的浏览器)。
示例代码:
<script type="text/javascript"> var width = window.innerWidth || document.documentElement.clientWidth; var height = window.innerHeight || document.documentElement.clientHeight; console.log("窗口宽度:"+width); console.log("窗口高度:"+height);</script>
阅读全文
0 0
- 获取游览器窗口的大小(window对象)
- JavaScript的游览器对象
- 获取窗口的大小
- 窗口(window)对象:
- window.showModalDialog在第二个窗口中获取第一个窗口的window对象
- 获取相对于窗口(window)的坐标
- 父窗口获取iframe子窗口window对象和document对象的方法
- window.open 和 window.showModelDialog 获取父窗口对象或属性的方式
- 认识Javascript中控制窗口大小的Screen和Window对象
- 获取浏览器窗口的大小
- 浏览器窗口变化实时获取window当前大小
- BOM——window对象之窗口大小
- cookie获取游览器的上次访问时间的代码
- javascript获取当前游览器的类型版本
- window对象详解,JavaScript 获取浏览器的显示区域大小信息
- html背景图片自适应游览器大小
- JS:1.7窗口(window)对象 window.close,window.open
- 获取iframe的window对象
- nodejs之npm详解
- poj算法-使用C语言在VC++6.0实现poj1003
- 触宝笔试
- 图片文件提取
- <aop:pointcut>正则表达式规则
- 获取游览器窗口的大小(window对象)
- Python基础教程(crossin全60课)
- 使用Echarts制作动态嵌套饼图
- Mybatis配置及动态SQL语句标签
- leetcode 第53题 Maximum Subarray:动态规划的活用
- creator js热更新
- Pycharm如何添加第三方库和插件
- opengl帧率的计算
- js基本数据类型-深入讲解(2)