Yêu cầu API toàn màn hìnhFullscreen()
Ví dụ
Hiển thị phần tử <video> ở chế độ toàn màn hình:
/* Get the element you want displayed in fullscreen mode (a video in this
example): */
var elem = document.getElementById("myvideo");
/* When
the openFullscreen() function is executed, open the video in fullscreen.
Note that we must include prefixes for different browsers, as they don't
support the requestFullscreen property yet */
function openFullscreen() {
if (elem.requestFullscreen) {
elem.requestFullscreen();
} else if (elem.webkitRequestFullscreen)
{ /* Safari */
elem.webkitRequestFullscreen();
} else if (elem.msRequestFullscreen)
{ /* IE11 */
elem.msRequestFullscreen();
}
}
Hãy tự mình thử »Thêm ví dụ "Hãy tự mình thử" bên dưới.
Sự miêu tả
Phương thức requestFullscreen() mở một phần tử ở chế độ toàn màn hình.
Mẹo: Sử dụng phương thức exitFullscreen() để hủy chế độ toàn màn hình.
Hỗ trợ trình duyệt
Các số trong bảng chỉ định phiên bản trình duyệt đầu tiên hỗ trợ đầy đủ phương pháp này. Lưu ý: Một số trình duyệt yêu cầu tiền tố cụ thể (xem dấu ngoặc đơn):
Method | |||||
---|---|---|---|---|---|
requestFullscreen() | 71.0 15.0 (webkit) |
79.0 11.0 (ms) |
64.0 9.0 (moz) |
6.0 (webkit) | 58.0 15.0 (webkit) |
Cú pháp
HTMLElementObject .requestFullscreen()
Thông số
Không có |
Chi tiết kỹ thuật
Giá trị trả về: | Không có giá trị trả về |
---|
Thêm ví dụ
Để mở trang HTML ở chế độ toàn màn hình, hãy sử dụng document.documentElement
thay vì document.getElementById(" element ")
. Trong ví dụ này, chúng tôi cũng sử dụng chức năng đóng để đóng toàn màn hình:
Ví dụ
/* Get the documentElement (<html>) to display the page in fullscreen */
var elem = document.documentElement;
/* View in fullscreen */
function openFullscreen() {
if (elem.requestFullscreen) {
elem.requestFullscreen();
} else if (elem.webkitRequestFullscreen)
{ /* Safari */
elem.webkitRequestFullscreen();
}
else if (elem.msRequestFullscreen) { /* IE11 */
elem.msRequestFullscreen();
}
}
/*
Close fullscreen */
function closeFullscreen() {
if (document.exitFullscreen) {
document.exitFullscreen();
} else if (document.webkitExitFullscreen)
{ /* Safari */
document.webkitExitFullscreen();
}
else if (document.msExitFullscreen) { /* IE11 */
document.msExitFullscreen();
}
}
Hãy tự mình thử »Bạn cũng có thể sử dụng CSS để tạo kiểu cho trang khi nó ở chế độ toàn màn hình:
Ví dụ
/* Safari */
:-webkit-full-screen {
background-color: yellow;
}
/* IE11 syntax */
:-ms-fullscreen {
background-color: yellow;
}
/* Standard syntax */
:fullscreen {
background-color: yellow;
}
Hãy tự mình thử »