screen物件可以用來偵測與螢幕解析度相關的資訊，其屬性列表如下：
- screen.width 目前顯示器的寬度（單位;像素）
- screen.height 目前顯示器的寬度（單位;像素）
- screen.pixelDepth 顯示色彩度像素的位元數量
- screen.colorDepth 可顯示的色彩數量
螢幕區域
所謂螢幕區域，就是你目前螢幕的「解析度」，如果你要調整你目前顯示器的解析度，可以由「控制台」的「顯示器」項目中做設定，但是必須切換「顯示器內容」對話視窗的選項頁為「設定值」，然後在「螢幕區域」的項目中做設定。
「解析度」的設定分為「水平」方向與「垂直」方向，其設定值是兩兩配對的，如果你的螢幕是17吋的，那你可能將解析度設為「800x600」，而螢幕15吋的，那你可能將解析度設為「640x480」，解析度越高畫面越精緻，但是畫面也會變小。
當我們以解析度「800x600」來設計網頁，若瀏覽者以「800x600」的解析度來觀看我們的網頁，則瀏覽者將可以瀏覽到畫面完整而內容正確的網頁，但瀏覽者以「640x480」的解析度來觀看我們的網頁時，則瀏覽者將可能獲得如奇怪畫面。
為了讓我們精心設計的網頁能夠完整的顯示在瀏覽器中，避免因瀏覽者顯示器解析度與我們網頁設計時的解析度不同而造成瀏覽畫面偏差，所以我們可以利用screen物件對瀏覽者的顯示器解析度加以偵測，並告知瀏覽者適當的調整其顯示器解析度，以便獲得最佳的網頁觀賞畫面！
要得知瀏覽者顯示器「水平」方向的螢幕解析度，我們可以利用screen物件的『width』屬性，而使用screen物件的『height』屬性則可得知瀏覽者顯示器「垂直」方向的螢幕解析度。
實例學習：
利用screen物件的『width』屬性與『height』屬性偵測瀏覽者顯示器「水平」、「垂直」方向的螢幕解析度。
實作學習：
瀏覽者顯示器解析度建議。
色彩度偵測
與顯示器設定相關的項目還有一個「色彩」，也就是設定在螢幕上可以見到的色彩數目，顯示器可設定的色彩數量有「4位元/16色」、「8位元/256色」、「16位元/高彩」與「32位元/全彩」。
色彩度越高，可用顏色就多，相對的，網頁中的圖像也就更逼真，當我們以「16位元/高彩」的色彩度設計網頁，若瀏覽者同樣以「16位元/高彩」的色彩度來觀看我們的網頁，則瀏覽者將可以瀏覽到色像正確的網頁畫面 。
若我們以「16位元/高彩」的色彩度設計網頁，而瀏覽卻以低於「８位元/256色」的色彩度來觀看我們的網頁，則瀏覽者所瀏覽的網頁畫面將是不堪入目，要避免瀏覽者因色彩度不夠而造成網頁顯示畫面失真，我們可以利用screen物件對瀏覽者的顯示器色彩度加以偵測，並告知瀏覽者適當的調整其顯示器色彩度，以便獲得最佳的網頁觀賞畫面！
screen物件有兩個屬性可用來偵測使用者顯示器的色彩度，一是「pixeDepth」屬性，用來偵測每個顯示像素的位元數，請注意：「pixeDepth」屬性的值是「位元數」！其屬性值是一個數字，例如，色彩度為「16位元/高彩」，則「pixeDepth」屬性的值是「16」；另一個可用來偵測使用者顯示器的色彩度屬性是「colorDepth」，用來偵測可顯示的顏色數量，其屬性值也是一個數字。
「pixeDepth」屬性為Netspace適用，而「colorDepth」屬性為Internet Explorer（IE）適用，因此，在偵測使用者顯示器的色彩度之前，必須先使用瀏覽器物件『navigator』的「appName」屬性判別瀏覽者是使用哪一種瀏覽器，再依照瀏覽器種類選用適當的色彩度偵測屬性！
實作學習：
利用screen物件的「pixeDepth」屬性與「colorDepth」屬性偵測使用者顯示器的色彩度。
實作學習：
瀏覽者顯示器色彩度建議。
沒有留言:
張貼留言