หน้าจอหน้าต่าง JavaScript
วัตถุ window.screen มีข้อมูลเกี่ยวกับหน้าจอของผู้ใช้
หน้าจอหน้าต่าง
window.screen
สามารถเขียนวัตถุโดยไม่มีคำนำหน้าหน้าต่าง
คุณสมบัติ:
screen.width
screen.height
screen.availWidth
screen.availHeight
screen.colorDepth
screen.pixelDepth
ความกว้างของหน้าจอหน้าต่าง
คุณสมบัติscreen.width
ส่งคืนความกว้างของหน้าจอของผู้เข้าชมเป็นพิกเซล
ตัวอย่าง
แสดงความกว้างของหน้าจอเป็นพิกเซล:
document.getElementById("demo").innerHTML =
"Screen Width: " + screen.width;
ผลลัพธ์จะเป็น:
Screen Width: 1920
ความสูงของหน้าจอหน้าต่าง
สถาน ที่screen.height
ให้บริการส่งคืนความสูงของหน้าจอของผู้มาเยี่ยมเป็นพิกเซล
ตัวอย่าง
แสดงความสูงของหน้าจอเป็นพิกเซล:
document.getElementById("demo").innerHTML =
"Screen Height: " + screen.height;
ผลลัพธ์จะเป็น:
Screen Height: 10000
หน้าจอหน้าต่างที่มีจำหน่ายความกว้าง
คุณสมบัติscreen.availWidth
จะคืนค่าความกว้างของหน้าจอของผู้เยี่ยมชมเป็นพิกเซล ลบด้วยคุณสมบัติอินเทอร์เฟซ เช่น แถบงานของ Windows
ตัวอย่าง
แสดงความกว้างที่ใช้ได้ของหน้าจอเป็นพิกเซล:
document.getElementById("demo").innerHTML =
"Available Screen Width: " + screen.availWidth;
ผลลัพธ์จะเป็น:
Available Screen Width: 1920
หน้าจอหน้าต่างที่มีความสูง
คุณสมบัติscreen.availHeight
ส่งคืนความสูงของหน้าจอของผู้เยี่ยมชม เป็นพิกเซล ลบด้วยคุณสมบัติอินเทอร์เฟซ เช่น แถบงานของ Windows
ตัวอย่าง
แสดงความสูงที่ใช้ได้ของหน้าจอเป็นพิกเซล:
document.getElementById("demo").innerHTML =
"Available Screen Height: " + screen.availHeight;
ผลลัพธ์จะเป็น:
Available Screen Height: 10000
ความลึกของสีของหน้าจอหน้าต่าง
คุณสมบัติscreen.colorDepth
ส่งคืนจำนวนบิตที่ใช้แสดงสีเดียว
คอมพิวเตอร์สมัยใหม่ทั้งหมดใช้ฮาร์ดแวร์ 24 บิตหรือ 32 บิตสำหรับความละเอียดของสี:
- 24 บิต = 16,777,216 "True Colours" ที่แตกต่างกัน
- 32 บิต = 4,294,967,296 "สีลึก" ที่แตกต่างกัน
คอมพิวเตอร์รุ่นเก่าใช้ 16 บิต: ความละเอียด "High Colours" ต่างกัน 65,536 รายการ
คอมพิวเตอร์ที่เก่ามาก และโทรศัพท์มือถือรุ่นเก่าใช้ 8 บิต: "สี VGA" ที่ต่างกัน 256 สี
ตัวอย่าง
แสดงความลึกของสีของหน้าจอเป็นบิต:
document.getElementById("demo").innerHTML =
"Screen Color Depth: " + screen.colorDepth;
ผลลัพธ์จะเป็น:
Screen Color Depth: 24
ค่า #rrggbb (rgb) ที่ใช้ใน HTML แสดงถึง "True Colors" (16,777,216 สีที่ต่างกัน)
ความลึกพิกเซลของหน้าจอหน้าต่าง
คุณสมบัติscreen.pixelDepth
ส่งคืนความลึกของพิกเซลของหน้าจอ
ตัวอย่าง
แสดงความลึกของพิกเซลของหน้าจอเป็นบิต:
document.getElementById("demo").innerHTML =
"Screen Pixel Depth: " + screen.pixelDepth;
ผลลัพธ์จะเป็น:
Screen Pixel Depth: 24
สำหรับคอมพิวเตอร์สมัยใหม่ ความลึกของสีและความลึกของพิกเซลจะเท่ากัน