JavaScript BOM对象-Screen窗口屏幕对象

 2016年04月01日    50     声明


Screen窗口屏幕对象,Screen对象在JavaScript中并不太常用。Screen对象主要用于返回用户显示器屏幕的相关信息,如:像素的宽度、高度和色深等信息。


  1. Screen对象
  2. Screen对象属性
  3. Screen对象方法与事件

1. Screen对象

Screen对象会返回一个与窗口关联的屏幕对象的引用,Screen是一个特殊的对象,是用户访问屏幕的一个接口,用于检查当前窗口正在呈现的屏幕的属性。

可以通过window.screenscreen来访问Screen对象。

screenObj = window.screen;

如,根据屏慕像素的位深加载不同版本的页面:

if (screen.pixelDepth < 8) {
  // 加载低色版本的页面
} else { 
  // 加载全色版本的页面
}


2. Screen对象属性

  • Screen.availTop:未被系统部件占用的,最上方的像素值
  • Screen.availLeft:未被系统部件占用的,左侧的像素值
  • Screen.availHeight:屏幕高度减去系统部件后的高度
  • Screen.availWidth:屏幕高度减去系统部件后的宽度
  • Screen.colorDepth:屏幕的颜色位数
  • Screen.height:屏幕的像素高度
  • Screen.width:屏幕的像素宽度
  • Screen.left:屏幕距左边的距离
  • Screen.top:屏幕距上边的距离
  • Screen.orientation:返回当前屏幕的方向
  • Screen.pixelDepth:返回屏幕的位深


3. Screen对象方法与事件

3.1 对象方法

Screen.lockOrientation()

lockedAllowed = window.screen.lockOrientation(orientation);

锁定屏幕方向(仅移动设备可用)。


Screen.unlockOrientation()

var unlocked = window.screen.unlockOrientation();

解锁屏幕方向。

screen.lockOrientationUniversal = screen.lockOrientation || screen.mozLockOrientation || screen.msLockOrientation;

if (screen.lockOrientationUniversal("landscape-primary")) {
  // 方向锁定成功
} else {
  // 方向锁定失败
}


3.2 对象事件

'onorientationchange'

当屏幕方法改变时触发'onorientationchange'事件。

screen.onorientationchange = funcRef;