Khi tôi "toàn màn hình" thành phần (giả sử div), tôi không thể hiển thị bất kỳ phần tử nào khác (trong khi ở chế độ toàn màn hình). Tại sao điều đó lại xảy ra? Làm thế nào tôi có thể thực hiện điều này?Hiển thị các phần tử không phải nguyên tố toàn màn hình (API toàn màn hình HTML5)
liên quan: Is there a way to overlay a <canvas> over a fullscreen HTML5 <video>?
Dường như trình duyệt (Chrome 28, Firefox 23) thiết lập các z-index của các yếu tố độ toàn màn hình để 2147483647 (phiên bản 32-bit đã ký số lớn nhất). Theo các bài kiểm tra, việc đặt z-index các phần tử khác vào cùng một z-index sẽ khiến chúng hiển thị, nhưng không thể thay đổi z-index của phần tử toàn màn hình (có thể, nhưng trình duyệt chỉ bỏ qua giá trị - ngay cả với! Quan trọng).
Có thể tham khảo duy nhất tôi có thể tìm thấy điều này:
https://github.com/WebKit/webkit/blob/master/LayoutTests/fullscreen/full-screen-zIndex.html
Ngoài ra, trong các công cụ dev Chrome:
yếu tố Vì vậy, hoặc thiết lập để tối đa z-index, hoặc, giải pháp tốt hơn là chỉ cần tạo phần tử vùng chứa, làm cho nó sao cho tất cả các phần tử bạn muốn hiển thị là phần tử con của phần tử vùng chứa và toàn màn hình.
Khi tôi thử tính năng này, nó chỉ hoạt động trong Chrome chứ không phải Firefox hoặc IE11, mặc dù chỉ mục z của phần tử toàn màn hình được đặt trong cả ba. – trysis
giống nhau ở đây, 3 năm sau. – Dalibor
Đây là giải pháp Firefox: https://stackoverflow.com/questions/45798213/firefox-fullscreen-video-append-dom-elements – Dalibor