文章出處
文章列表
前面的話
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);//1040 console.log(screen.availWidth);//1920
【height】
屏幕的像素高度
【width】
屏幕的像素寬度
console.log(screen.width);//1920 console.log(screen.height);//1080
screen.height和screen.width兩個屬性,一般用來了解設備的分辨率。除非調整顯示器的分辨率,否則這兩個值可以看作常量,不會發生變化。顯示器的分辨率與瀏覽器設置無關,縮放網頁并不會改變分辨率
可以根據屏幕分辨率,將用戶導向不同網頁
if ((screen.width <= 800) && (screen.height <= 600)) { window.location.replace('small.html'); } else { window.location.replace('wide.html'); }
文章列表
全站熱搜