頁面可以編輯
document.body.contentEditable = true 你會發現整個頁面都是可編輯的(可以用來裝逼);
全屏 API(Fullscreen API)
Element.requestFullscreen() 方法用於發出異步請求使元素進入全屏模式。
調用此 API 並不能保證元素一定能夠進入全屏模式。如果元素被允許進入全屏幕模式,document 對象會收到一個 fullscreenchange 事件,通知調用者當前元素已經進入全屏模式。如果全屏請求不被許可,則會收到一個 fullscreenerror 事件。
當進入/退出全屏模式時,會觸發 fullscreenchange 事件。你可以在監聽這個事件,做你想做的事。
fullScreenFun: function(){
let self = this;
var fullscreenEnabled = document.fullscreenEnabled ||
document.mozFullScreenEnabled ||
document.webkitFullscreenEnabled ||
document.msFullscreenEnabled;
if (fullscreenEnabled) {
let de = document.documentElement;
if(self.fullScreenInfo === '打開全屏'){
if( de.requestFullscreen ){
de.requestFullscreen();
}else if( de.mozRequestFullScreen ){
de.mozRequestFullScreen();
}else if( de.webkitRequestFullScreen ){
de.webkitRequestFullScreen();
}
self.fullScreenInfo = '退出全屏'
} else {
if( document.exitFullscreen ){
document.exitFullscreen();
}else if( document.mozCancelFullScreen ){
document.mozCancelFullScreen();
}else if( document.webkitCancelFullScreen ){
document.webkitCancelFullScreen();
}
self.fullScreenInfo = '打開全屏'
}
} else {
self.fullScreenInfo = '瀏覽器當前不能全屏';
}
}
相關:
document.fullscreenElement: 當前處於全屏狀態的元素 element
document.fullscreenEnabled: 標記 fullscreen 當前是否可用
document.exitFullscreen(): 退出全屏