效果如下：

代码如下：

<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 Demo】JS获取当前对象大小以及屏幕分辨率等的更多相关文章

  1. （转)JS获取当前对象大小以及屏幕分辨率等

    原文 JS获取当前对象大小以及屏幕分辨率等   <script type="text/javascript">function getInfo(){       var ...

  2. JS获取当前对象大小以及屏幕分辨率等...

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"/> <meta nam ...

  3. （转）JS获取当前对象大小以及屏幕分辨率等

    Code highlighting produced by Actipro CodeHighlighter (freeware)http://www.CodeHighlighter.com/--> ...

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

    网页可见区域宽:document.body.clientWidth 网页可见区域高:document.body.clientHeight 网页可见区域宽:document.body.offsetWid ...

  5. js获取页面宽度高度及屏幕分辨率

    网页可见区域宽:document.body.clientWidth 网页可见区域高:document.body.clientHeight 网页可见区域宽:document.body.offsetWid ...

  6. js 获取 客户区 大小

    js 获取 客户区 大小 本文内容来自<javascript高级程序设计(第二版)> 内容, 只是方便大家以后可能会用到... <script type="text/jav ...

  7. 【全面总结】js获取元素位置大小

    [js获取元素位置+元素大小]全面总结 目录 1.关于offset offsetParent(只读) offsetTop(只读) offsetLeft(只读) offsetHeight(只读) off ...

  8. 前端页面js与flash交互——js获取flash对象，并传递参数

    背景介绍: 最近在搞一个项目,涉及到图片选取,裁剪,上传等,由于浏览器安全性问题,js无法获取到<input type="file">中选取的文件路径,而且对照片的裁剪 ...

  9. 前端之JavaScript：JS之DOM对象三

    js之DOM对象三   一.JS中for循环遍历测试 for循环遍历有两种 第一种:是有条件的那种,例如    for(var i = 0;i<ele.length;i++){} 第二种:for ...

随机推荐

  1. JPA学习(6)JPQL

    JPQL语言,即 Java Persistence Query Language 的简称.JPQL 是一种和 SQL 非常类似的中间性和对象化查询语言,它最终会被编译成针对不同底层数据库的 SQL 查 ...

  2. Spring RMI Example

    一: 提供服务的远程一端 1-1. applicationContext.xml <?xml version="1.0" encoding="UTF-8" ...

  3. Hibernate之lazy延迟加载（转）

    一.延迟加载的概念 当Hibernate从数据库中加载某个对象时,不加载关联的对象,而只是生成了代理对象,获取使用session中的load的方法(在没有改变lazy属性为false的情况下)获取到的 ...

  4. WinJs项目介绍

        WinJs库是最近微软公布的一个开源项目.它与开源社区的协作共同完成.为了轻易创建HTML/JS/CSS应用程序开发的解决方案.WinJS是一个Javascripts的工具箱让开发人员使用HT ...

  5. Webform（Repeater控件）

    一.Repeater控件 有五大模板 ItemTemplate :有多少条数据,执行多少遍        AlternatingItemTemplate : 对交替数据项进行格式设置       Se ...

  6. 使用openssl创建自签名证书及部署到IIS教程

    概要 本文讲解三个部分:1. 创建自签名证书2. 创建自己的证书颁发机构3. 以及如何配置IIS 创建自签名证书 首先,创建一个私钥文件: openssl genrsa -out myselfsign ...

  7. 删除src值为空的img标签

    今天刚刚完成了一个官网的前后台整站建设,虽然不是很复杂,但感觉获益良多.由于涉及到一点后台问题,所以期间遇到了不少问题.学到的东西,得作个总结.今天先讲讲img的路径问题.由于现在很多网站喜欢全屏大图 ...

  8. 为什么要选择Sublime Text3？

    为什么要选择Sublime Text3? Sublime Text3 自动保存,打开图片 跨平台启动快!!!!多行游标,太好用. 插件,简直选不过来. 代码片段 VIM兼容模式 菜单栏基础功能介绍 F ...

  9. CSS类选择器和ID选择器

    CSS类选择器和ID选择器皆允许以一种独立于文档元素的方式来指定样式,同时二者皆区分大小写. 区别如下: 第一:在同一个页面内,不允许有相同名字的id对象出现,但是允许相同名字的class 第二:当页 ...

  10. This application is currently offline. To enable the application, remove the app_offline.htm file from the application root directory.

    IIS提示:This application is currently offline. To enable the application, remove the app_offline.htm f ...