前面的话

  screen对象在javascript编程中,比较冷门,不太常用。screen对象用来表明客户端的能力,其中包括浏览器窗口外部的显示器的信息,如像素高度和宽度等。本文将详细介绍screen对象

总括

  每个浏览器中的screen对象都包含着各不相同的属性,其中chrome包含9个属性,firefox包含10个,IE8-浏览器包含14个,IE9+浏览器包含17个。下面将这17个属性概述如下

属性              说明

height            屏幕的像素高度
width 屏幕的像素宽度
availHeight 屏幕的像素高度减去系统部件高度之后的值(只读)
availWidth 屏幕的像素宽度减去系统部件宽度之后的值(只读) left 当前屏幕距左边的像素距离[firefox返回0,chrome和IE不支持]
top 当前屏幕距上方的像素距离[firefox返回0,chrome和IE不支持]
availLeft 未被系统部件占用的最左侧的像素值(只读)[chrome和firefox返回0,IE不支持]
availTop 未被系统部件占用的最上方的像素值(只读)[chrome和firefox返回0,IE不支持] bufferDepth 读、写用于呈现屏外位图的位数[IE返回0,chrome和firefox不支持]
colorDepth 用于表现颜色的位数(只读)[IE8-返回32,其他浏览器返回24]
pixelDepth 屏幕的位深(只读)[IE8-不支持,其他浏览器返回24] deviceXDPI 屏幕实际的水平DPI(只读)[IE返回96,chrome和firefox不支持]
deviceYDPI 屏幕实际的垂直DPI(只读)[IE返回96,chrome和firefox不支持]
logicalXDPI 屏幕逻辑的水平DPI(只读)[IE返回96,chrome和firefox不支持]
logicalYDPI 屏幕逻辑的垂直DPI(只读)[IE返回96,chrome和firefox不支持] updateInterval 读、写以毫秒表示的屏幕刷新时间间隔[IE返回0,chrome和firefox不支持]
fontSmoothingEnabled 是否启用了字体平滑(只读)[IE返回true,chrome和firefox不支持]

常用

【availHeight】

  屏幕的像素高度减去系统部件高度之后的值(只读),代表屏幕可用高度,单位为像素

【availHeight】

  屏幕的像素宽度减去系统部件宽度之后的值(只读),代表屏幕可用宽度,单位为像素

console.log(screen.availHeight);//
console.log(screen.availWidth);//

【height】

  屏幕的像素高度

【width】

  屏幕的像素宽度

console.log(screen.width);//
console.log(screen.height);//

  screen.height和screen.width两个属性,一般用来了解设备的分辨率。除非调整显示器的分辨率,否则这两个值可以看作常量,不会发生变化。显示器的分辨率与浏览器设置无关,缩放网页并不会改变分辨率

  可以根据屏幕分辨率,将用户导向不同网页

if ((screen.width <= 800) && (screen.height <= 600)) {
window.location.replace('small.html');
} else {
window.location.replace('wide.html');
}

BOM之screen对象的更多相关文章

  1. JavaScript BOM-11-BOM的核心-window对象; window对象的控制,弹出窗口方法; 超时调用; 间歇调用; location对象常用属性; 位置操作--location.reaplace,location.reload(); BOM中的history对象; Screen对象及其常用属性; Navigator对象;

    JavaScript BOM 学习目标 1.掌握什么是BOM 2.掌握BOM的核心-window对象 3.掌握window对象的控制.弹出窗口方法 什么是bom BOM(browser object ...

  2. JS BOM基础 全局对象 window location history screen navigator

    全局变量声明的两种方式:1,window.变量名=值;2,var 变量名=值; 全局函数声明的两种方式:1,window.函数名=function(){}2,function 函数名=function ...

  3. BOM之navigator、history、screen对象

    navigator对象 [定义] navigator已经成为识别客户端浏览器的事实标准.下表中列出存在于所有浏览器的属性和方法 [检测插件] 检测浏览器插件是一种最常见的检测例程. [1]对于非IE浏 ...

  4. JavaScript的BOM(浏览器对象)基础语法总结

    1.window对象是BOM的核心,window对象指当前的浏览器窗口. window对象方法: 2.history对象记录了用户曾经浏览过的页面(URL),并可以实现浏览器前进与后退相似导航的功能. ...

  5. 细看JS中的BOM、DOM对象

                                        DOM对象模型  DOM(Document Object Model),是指文档对象模型,是W3C组织推荐的处理可扩展标志语言的 ...

  6. JS浏览器对象:window对象、History、Location对象、Screen对象

    一.JS浏览器对象-window 1.window对象 window对象是BOM的核心,window对象指当前的浏览器窗口 所有JavaScript全局对象.函数以及变量均自动成为window对象的成 ...

  7. JavaScript---Bom树的操作,内置方法和内置对象(window对象,location对象,navigator对象,history对象,screen对象)

    JavaScript---Bom树的操作,内置方法和内置对象(window对象,location对象,navigator对象,history对象,screen对象) 一丶什么是BOM ​      B ...

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

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

  9. Navigator对象、Screen对象

    Navigator对象:         Window对象的navigator属性引用的是包含浏览器厂商和版本信息的Navigator对象:   Navigator对象集合:plugins[] 返回对 ...

随机推荐

  1. 求 1+2+3+ …… +n

    题目来源: 自我感觉难度/真实难度: 题意: 分析: 自己的代码: def Sum_Solution(n): # write code here if n==1: return 1 else: ans ...

  2. POJ 2367 Genealogical tree 拓扑排序入门题

    Genealogical tree Time Limit: 1000MS   Memory Limit: 65536K Total Submissions: 8003   Accepted: 5184 ...

  3. C++ 怎么让静态变量只初始化一次

    童鞋们在学习C++的时候,往往只是按照书本上的原文去强行记忆各种特性,比方说,静态变量只初始化一次.你心中一定在默念:一定要记住,static只会初始化一次云云,希望自己能够记住.告诉你,你为什么总是 ...

  4. C++STL之Vector的应用

    这是我第一次写博客,请多指教! vector是一种向量容器,说白了就是可以改变大小的数组. vector是一个模板类,如果直接这样会报错: vector a; //报错,因为要指定模板. 需要像这样: ...

  5. 2017-2018-2 20155203《网络对抗技术》Exp5 MSF基础应用

    1.实践过程记录 1.1一个主动攻击实践,如ms08_067; msf > search ms08_067_netapi //查看可以用的工具 [!] Module database cache ...

  6. source insight之quicker.em宏的使用

    source insight有很多宏可以用,这里介绍的宏是quicker.em这个宏,它是华为的一个员工写的,很实用. 1.安装quicker.em宏 一.打开base这个工程Project-> ...

  7. SSRS配置1:凭证和邮件

    SSRS是微软的高度集成的报表服务,通过报表服务配置管理器(Reporting Service Configuration Manager,简称RSCM),能够轻松实现报表的配置和管理,本文主要分享凭 ...

  8. Markdown打造高逼格博客

    这里首先假设读者你已经掌握了Markdown与GitHub的基本用法 如果不会, 请先自行百度或Google, 我目前还没写Markdown与GitHub的教程 看云只是一个推荐, 可以认为协助生成格 ...

  9. OpenStack与OpenDaylight的对接过程

    由于项目中需要使用OpenDaylight(Oxygen)替换OpenStack(Otaca)中的neutron-openvswitch-agent,能找到的一些资料都是比较旧的版本,官网上的文档也一 ...

  10. [DEBUG]椭圆的中点Bresenham算法边缘绘制出现错误

    在使用椭圆的中点Bresenham算法绘制椭圆时, 当椭圆足够大时, 椭圆的边缘会出现下面这种情况. 出错原因: 将a, b声明为了int类型, 导致中点判别式中发生溢出 关注后面的a*b*a*b当a ...