2019年6月12日 星期三

(23)系統資訊 下篇

screen物件
screen物件可以用來偵測與螢幕解析度相關的資訊,其屬性列表如下:
  • screen.width 目前顯示器的寬度(單位;像素)
  • screen.height 目前顯示器的寬度(單位;像素)
  • screen.pixelDepth 顯示色彩度像素的位元數量
  • screen.colorDepth 可顯示的色彩數量

螢幕區域
 所謂螢幕區域,就是你目前螢幕的「解析度」,如果你要調整你目前顯示器的解析度,可以由「控制台」的「顯示器」項目中做設定,但是必須切換「顯示器內容」對話視窗的選項頁為「設定值」,然後在「螢幕區域」的項目中做設定。

「解析度」的設定分為「水平」方向與「垂直」方向,其設定值是兩兩配對的,如果你的螢幕是17吋的,那你可能將解析度設為「800x600」,而螢幕15吋的,那你可能將解析度設為「640x480」,解析度越高畫面越精緻,但是畫面也會變小。

當我們以解析度「800x600」來設計網頁,若瀏覽者以「800x600」的解析度來觀看我們的網頁,則瀏覽者將可以瀏覽到畫面完整而內容正確的網頁,但瀏覽者以「640x480」的解析度來觀看我們的網頁時,則瀏覽者將可能獲得如奇怪畫面。

為了讓我們精心設計的網頁能夠完整的顯示在瀏覽器中,避免因瀏覽者顯示器解析度與我們網頁設計時的解析度不同而造成瀏覽畫面偏差,所以我們可以利用screen物件對瀏覽者的顯示器解析度加以偵測,並告知瀏覽者適當的調整其顯示器解析度,以便獲得最佳的網頁觀賞畫面!

要得知瀏覽者顯示器「水平」方向的螢幕解析度,我們可以利用screen物件的『width』屬性,而使用screen物件的『height』屬性則可得知瀏覽者顯示器「垂直」方向的螢幕解析度。