JS获取当前网页大小以及屏幕分辨率等


Posted in Javascript onSeptember 05, 2014

效果如下:
JS获取当前网页大小以及屏幕分辨率等

代码如下:

<html>
<head>
<title>获取当前对象大小以及屏幕分辨率等</title>
<body>
<div style=" width:88%;margin:30px auto; color:blue;" id="div_html">
</div>
<script type="text/javascript">
var s = ""; 
s += " 网页可见区域宽:"+ document.body.clientWidth+"<br />"; 
s += " 网页可见区域高:"+ document.body.clientHeight+"<br />"; 
s += " 网页可见区域宽:"+ document.body.offsetWidth + " (包括边线和滚动条的宽)"+"<br />"; 
s += " 网页可见区域高:"+ document.body.offsetHeight + " (包括边线的宽)"+"<br />"; 
s += " 网页正文全文宽:"+ document.body.scrollWidth+"<br />"; 
s += " 网页正文全文高:"+ document.body.scrollHeight+"<br />"; 
s += " 网页被卷去的高(ff):"+ document.body.scrollTop+"<br />"; 
s += " 网页被卷去的高(ie):"+ document.documentElement.scrollTop+"<br />"; 
s += " 网页被卷去的左:"+ document.body.scrollLeft+"<br />"; 
s += " 网页正文部分上:"+ window.screenTop+"<br />"; 
s += " 网页正文部分左:"+ window.screenLeft+"<br />"; 
s += " 屏幕分辨率的高:"+ window.screen.height+"<br />"; 
s += " 屏幕分辨率的宽:"+ window.screen.width+"<br />"; 
s += " 屏幕可用工作区高度:"+ window.screen.availHeight+"<br />"; 
s += " 屏幕可用工作区宽度:"+ window.screen.availWidth+"<br />"; 
s += " 你的屏幕设置是 "+ window.screen.colorDepth +" 位彩色"+"<br />"; 
s += " 你的屏幕设置 "+ window.screen.deviceXDPI +" 像素/英寸"+"<br />"; 

document.getElementById("div_html").innerHTML = s;
</script>
</body>
</html>

代码说明图如下:

JS获取当前网页大小以及屏幕分辨率等

Javascript 相关文章推荐
Ext JS Grid在IE6 下宽度的问题解决方法
Feb 15 Javascript
JS解析XML的实现代码
Nov 12 Javascript
JQuery验证jsp页面属性是否为空(实例代码)
Nov 08 Javascript
JavaScript中的条件判断语句使用详解
Jun 03 Javascript
老生常谈遮罩层 滚动条的问题
Apr 29 Javascript
Js动态设置rem来实现移动端字体的自适应代码
Oct 14 Javascript
详解Angular中的自定义服务Service、Provider以及Factory
Apr 22 Javascript
使用JavaScript实现点击循环切换图片效果
Sep 03 Javascript
Node之简单的前后端交互(实例讲解)
Nov 14 Javascript
JavaScript 中使用 Generator的方法
Dec 29 Javascript
详解Vue.js iview实现树形权限表(可扩展表)
Sep 30 Javascript
解析原生JS getComputedStyle
May 25 Javascript
JS来动态的修改url实现对url的增删查改
Sep 05 #Javascript
jQuery表格插件datatables用法总结
Sep 05 #Javascript
jQuery中index()的用法分析
Sep 05 #Javascript
使用jquery解析XML的方法
Sep 05 #Javascript
JavaScript避免内存泄露及内存管理技巧
Sep 05 #Javascript
javascript获取dom的下一个节点方法
Sep 05 #Javascript
原生JavaScript生成GUID的实现示例
Sep 05 #Javascript
You might like
php读取文件内容至字符串中,同时去除换行、空行、行首行尾空格(Zjmainstay原创)
2012/07/31 PHP
PHP中数字检测is_numeric与ctype_digit的区别介绍
2012/10/04 PHP
win7 64位系统 配置php最新版开发环境(php+Apache+mysql)
2014/08/15 PHP
php写入、删除与复制文件的方法
2015/06/20 PHP
PHP简单处理表单输入的特殊字符的方法
2016/02/03 PHP
PHP实现的折半查找算法示例
2017/12/19 PHP
PHP定义字符串的四种方式详解
2018/02/06 PHP
JQuery悬停控制图片轮播——代码简单
2015/08/05 Javascript
javascript中SetInterval与setTimeout的定时器用法
2015/08/24 Javascript
JavaScript函数柯里化详解
2016/04/29 Javascript
原生JS实现在线问卷调查投票特效
2017/01/03 Javascript
JS 调试中常见的报错问题解决方法
2017/05/20 Javascript
基于BootStrap实现简洁注册界面
2017/07/20 Javascript
Webpack devServer中的 proxy 实现跨域的解决
2018/06/15 Javascript
create-react-app使用antd按需加载的样式无效问题的解决
2019/02/26 Javascript
Vant 在vue-cli 4.x中按需加载操作
2020/11/05 Javascript
[14:36]2014 DOTA2国际邀请赛中国区预选赛5.21 Orenda VS NE
2014/05/22 DOTA
Python里隐藏的“禅”
2014/06/16 Python
Python爬取网页中的图片(搜狗图片)详解
2017/03/23 Python
django ajax json的实例代码
2018/05/29 Python
Python中if elif else及缩进的使用简述
2018/05/31 Python
CentOS6.9 Python环境配置(python2.7、pip、virtualenv)
2019/05/06 Python
python实现列表的排序方法分享
2019/07/01 Python
Django之PopUp的具体实现方法
2019/08/31 Python
Python 日期的转换及计算的具体使用详解
2020/01/16 Python
使用jupyter notebook直接打开.md格式的文件
2020/04/10 Python
解决python中import文件夹下面py文件报错问题
2020/06/01 Python
英国女性化妆品收纳和家具网站:Beautify
2019/12/07 全球购物
竞选大学学委演讲稿
2014/09/13 职场文书
高二学年自我鉴定范文(2篇)
2014/09/26 职场文书
无刑事犯罪记录证明范本
2014/09/29 职场文书
学校感恩节活动策划方案
2014/10/06 职场文书
2015年幼儿园保育员工作总结
2015/04/23 职场文书
介绍信范文大全
2015/05/07 职场文书
导游词之湖州-太湖
2019/10/11 职场文书
Java 将PPT幻灯片转为HTML文件的实现思路
2021/06/11 Java/Android