*screen.width

  功能:声明了显示浏览器的屏幕的宽度,以像素计。

  语法:screen.width

*screen.height

  功能:声明了显示浏览器的屏幕的可用宽度,以像素计。

  语法:screen.availWidth

*screen.availWidth

  功能:声明了显示浏览器的屏幕的可用宽度,以像素计。

  语法:screen.availWidth

*screen.availHeight

  功能:声明了显示浏览器的屏幕的可用高度,以像素计。这个可用高度不包括分配给半永久特性(如屏幕底部的任务栏)的垂直空间。

  语法:screen.availHeight

*实例1

  获取浏览器的宽度、高度、可用宽度、可用高度。

  <script type="text/javascript">
  document.write( "屏幕宽度:"+screen.width+"px<br />" );
  document.write( "屏幕高度:"+screen.height+"px<br />" );
  document.write( "屏幕可用宽度:"+screen.availWidth+"px<br />" );
  document.write( "屏幕可用高度:"+screen.availHeight+"px" );
  </script>

  这段代码的效果为:

  屏幕宽度:1440px
  屏幕高度:900px
  屏幕可用宽度:1440px
  屏幕可用高度:870px
 
 

*更多

  HTML精确定位:scrollLeft,scrollWidth,clientWidth,offsetWidth

  scrollHeight: 获取对象的滚动高度。 
  scrollLeft:设置或获取位于对象左边界和窗口中目前可见内容的最左端之间的距离 
  scrollTop:设置或获取位于对象最顶端和窗口中可见内容的最顶端之间的距离 
  scrollWidth:获取对象的滚动宽度

  offsetHeight:获取对象相对于版面或由父坐标 offsetParent 属性指定的父坐标的高度 
  offsetLeft:获取对象相对于版面或由 offsetParent 属性指定的父坐标的计算左侧位置 
  offsetTop:获取对象相对于版面或由 offsetTop 属性指定的父坐标的计算顶端位置

  event.clientX 相对文档的水平座标 
  event.clientY 相对文档的垂直座标 
  event.offsetX 相对容器的水平坐标 
  event.offsetY 相对容器的垂直坐标

  document.documentElement.scrollTop 垂直方向滚动的值

  event.clientX+document.documentElement.scrollTop 相对文档的水平座标+垂直方向滚动的量

 这里是JavaScript中建造迁移转变代码的常用属性
  页可见区域宽: document.body.clientWidth;
  网页可见区域高: document.body.clientHeight;
  网页可见区域宽: document.body.offsetWidth   (包含边线的宽);
  网页可见区域高: document.body.offsetHeight (包含边线的宽);
  网页正文全文宽: document.body.scrollWidth;
  网页正文全文高: document.body.scrollHeight;
  网页被卷去的高: document.body.scrollTop;
  网页被卷去的左: document.body.scrollLeft;
  网页正文项目组上: window.screenTop;
  网页正文项目组左: window.screenLeft;
  屏幕辨别率的高: window.screen.height;
  屏幕辨别率的宽: window.screen.width;
  屏幕可用工作区高度: window.screen.availHeight;

网页Screen width、height、availWidth、availHeight属性的更多相关文章

  1. 网页的Width ,Height

    Jquery中可直接用接口$().height(); 获取浏览器窗口高$(window).height() 获取内部文档高$("body").height() 原生JS 网页可见区 ...

  2. 如何理解VB窗体中的scale类属性及width height属性之间的关系

    如何理解VB窗体中的scale类属性及width height属性之间的关系 VB中的SCALEHIEGT,SCALEWIDTH,与窗体中的WIDTH,HEIGHT的区别及关系是许多VB初学者难以理解 ...

  3. screen.height && screen.width

    screen.height && screen.width how to get window max width in js screen.height; screen.width; ...

  4. JS对象 屏幕分辨率的高和宽 window.screen 对象包含有关用户屏幕的信息。 1. screen.height 返回屏幕分辨率的高 2. screen.width 返回屏幕分辨率的宽

    屏幕分辨率的高和宽 window.screen 对象包含有关用户屏幕的信息. 1. screen.height 返回屏幕分辨率的高 2. screen.width 返回屏幕分辨率的宽 注意: 1.单位 ...

  5. 了解screen对象的常用视图属性

    前面的话 screen对象基本上只用来表明客户端的能力,其中包括浏览器窗口外部的显示器的信息,如像素高度和宽度等.每个浏览器中的screen对象都包含着各不相同的属性.本文将详细介绍screen对象的 ...

  6. 关于对象的 width offsetwidth availWidth scrollHeight

    别人总结的.自己记不住,所以留着 了 offsetWidth 包含了对象的边线的宽度width 若你不在html 代码里明确指定这个值,那它的返回值会不一样,如果设置了width 则一样. widht ...

  7. javascript 获取文档/屏幕的Width||Height

    document.body.clientWidth //网页可见区域宽度document.body.clientHeight //网页可见区域高度document.body.offsetWidth / ...

  8. [转]了解screen对象的常用视图属性

    前面的话 screen对象基本上只用来表明客户端的能力,其中包括浏览器窗口外部的显示器的信息,如像素高度和宽度等.每个浏览器中的screen对象都包含着各不相同的属性.本文将详细介绍screen对象的 ...

  9. clientX、pageX、scrollLeft、offsetLeft、clientWidth、screen.width的用法和区别

    一.定义和用法 1.event.clientX:事件对象的水平偏移量: event.clientY:事件对象的垂直偏移量: 2.event.pageX:事件对象加上滚动距离后的水平偏移量: event ...

随机推荐

  1. 2016-2017-2 《Java程序设计》教学进程

    2016-2017-2 <Java程序设计>教学进程 目录 考核方式 课前准备 教学进程 第00周学习任务和要求 第01周学习任务和要求 第02周学习任务和要求 第03周学习任务和要求 第 ...

  2. 分享 Ionic 开发 Hybrid App 中遇到的问题以及后期发布 iOS/Android 的方方面面

    此篇文章主要整理了最近在使用 Ionic 开发 Hybrid App 过程中遇到的一些疑难点以及后期发布生成 iOS 和 Android 版本过程中的种种问题. 文章目录 Ionic 简介和项目需求介 ...

  3. URLConnection类介绍

    URLConnection是一个功能强大的抽象类,它表示指向URL指定资源的活动连接. 与URL类相比,它与服务器的交互提供了更多的控制机制.尤其服务器是HTTP服务器,可以使用URLConnecti ...

  4. Java Collection

    在 Java2中,有一套设计优良的接口和类组成了Java集合框架Collection,使程序员操作成批的数据或对象元素极为方便.这些接口和类有很多对抽象数据类型操作的API,而这是我们常用的且在数据结 ...

  5. 使用antd UI组件有感

    公司使用的的react.js的版本提14.7的,JS版本使用的是ES6语法,因此在使用antd过程中,有些许不愉快的记录,分享给大家,一起学习: 如果是react 14.7版本时,使用getField ...

  6. Mac下Intellij IDEA Console中文是?

    Mac下Intellij IDEA Console中文是?,解决办法是在运行时的VM参数配置也加入: -Dfile.encoding=UTF-8

  7. Android开发笔记之《知识漏点纪录与学习》

    1. NDK的异常捕获方法 2. Andorid性能优化:http://www.cnblogs.com/yezhennan/p/5442557.html 3. 插件化与组件化:http://blog. ...

  8. Kafka实战-Flume到Kafka

    1.概述 前面给大家介绍了整个Kafka项目的开发流程,今天给大家分享Kafka如何获取数据源,即Kafka生产数据.下面是今天要分享的目录: 数据来源 Flume到Kafka 数据源加载 预览 下面 ...

  9. win7电脑怎么修改计算机用户名Administrator

    ----------------------------------- 首先,在开始中打开我的控制面板.----->>打开用户账户和家庭安全选项.----->>,继续点击用户账 ...

  10. 11月10日上午ajax基础知识、用ajax做登录页面、用ajax验证用户名是否可用、ajax动态调用数据库

    1.ajax的基础知识 ajax是结合了jquery.php等几种技术延伸出来的综合运用的技术,不是新的内容.ajax也是写在<script>标签里面的. 如果使用ajax一定是要有1个处 ...