html實現(xiàn)元素全屏的時候，會在該元素上加上如下css距贷，該css無法被覆蓋和修改。
:not(:root):fullscreen {
object-fit: contain;
position: fixed !important;
top: 0px !important;
right: 0px !important;
bottom: 0px !important;
left: 0px !important;
box-sizing: border-box !important;
min-width: 0px !important;
max-width: none !important;
min-height: 0px !important;
max-height: none !important;
width: 100% !important;
height: 100% !important;
transform: none !important;
margin: 0px !important;
}
我們可以通過對元素通過調(diào)用requestFullscreen來開啟全屏
dom.requestFullscreen
? dom.requestFullscreen()
: dom.webkitRequestFullscreen
? dom.webkitRequestFullscreen()
: dom.mozRequestFullScreen
? dom.mozRequestFullScreen()
: dom.msRequestFullscreen && dom.msRequestFullscreen()
通過調(diào)用document.exitFullscreen來退出全屏
document.exitFullscreen
? document.exitFullscreen()
: document.webkitExitFullscreen
? document.webkitExitFullscreen()
: document.mozCancelFullScreen
? document.mozCancelFullScreen()
: document.msExitFullscreen && document.msExitFullscreen()
