Yêu cầu API toàn màn hìnhFullscreen ()
❮ API toàn màn hìnhThí 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();
}
}
Thêm các ví dụ "Hãy tự mình thử" bên dưới.
Định nghĩa và Cách sử dụng
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 một 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ả lại: | Không có giá trị trả lại |
---|
Các ví dụ khác
Để mở trang HTML ở chế độ toàn màn hình, hãy sử dụng document.documentElement
thay thế . Trong ví dụ này, chúng tôi cũng sử dụng hàm đóng để đóng toàn màn hình:document.getElementById("element")
Thí 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();
}
}
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:
Thí dụ
/* Safari */
:-webkit-full-screen {
background-color: yellow;
}
/* IE11 syntax */
:-ms-fullscreen {
background-color: yellow;
}
/* Standard syntax */
:fullscreen {
background-color: yellow;
}
❮ API toàn màn hình