vue實現(xiàn)進(jìn)入全屏和退出全屏的示例代碼
更新時間：2023年12月13日 14:55:20 作者：Zwq8023520
最近一個項目需要進(jìn)行大屏展示,所以登錄完就要處于一個全屏的狀態(tài),本文主要介紹了vue實現(xiàn)進(jìn)入全屏和退出全屏的示例代碼,具有一定的參考價值,感興趣的可以了解一下
最近一個項目需要進(jìn)行大屏展示，所以登錄完就要處于一個全屏的狀態(tài)，當(dāng)切換到控制臺之后就可以退出全屏。在登錄之后調(diào)用enterFullscreen方法，就可以進(jìn)入全屏。在點擊切換到控制臺時，可以調(diào)用exitFullscreen方法。
enterFullscreen() {
const element = document.documentElement
if (element.requestFullscreen) {
element.requestFullscreen()
} else if (element.mozRequestFullScreen) {
element.mozRequestFullScreen()
} else if (element.webkitRequestFullscreen) {
element.webkitRequestFullscreen()
} else if (element.msRequestFullscreen) {
element.msRequestFullscreen()
}
},exitFullscreen() {
if (
document.fullscreenElement ||
document.webkitFullscreenElement ||
document.mozFullScreenElement ||
document.msFullscreenElement
) {
if (document.exitFullscreen) {
document.exitFullscreen()
} else if (document.webkitExitFullscreen) {
document.webkitExitFullscreen()
} else if (document.mozCancelFullScreen) {
document.mozCancelFullScreen()
} else if (document.msExitFullscreen) {
document.msExitFullscreen()
}
}
},到此這篇關(guān)于vue實現(xiàn)進(jìn)入全屏和退出全屏的示例代碼的文章就介紹到這了,更多相關(guān)vue 進(jìn)入全屏和退出全屏內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！
相關(guān)文章
本篇文章主要介紹了vue使用iframe嵌入網(wǎng)頁的示例代碼，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2018-03-03
這篇文章主要為大家詳細(xì)介紹了vuedraggable實現(xiàn)拖拽功能，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們可以參考一下2022-04-04
這篇文章主要介紹了vue實現(xiàn)flv格式視頻播放,本文通過實例代碼給大家介紹的非常詳細(xì)，對大家的學(xué)習(xí)或工作具有一定的參考借鑒價值，需要的朋友可以參考下2023-07-07
這篇文章主要介紹了vue3使用ref的性能警告問題，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2023-04-04
這篇文章主要介紹了詳解Vue.js項目API、Router配置拆分實踐,小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2018-03-03
今天小編就為大家分享一篇vue給對象動態(tài)添加屬性和值的實例，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2019-09-09
使用vue2實現(xiàn)帶地區(qū)編號和名稱的省市縣三級聯(lián)動效果
我們知道省市區(qū)縣都有名稱和對應(yīng)的數(shù)字唯一編號，使用編號可以更方便查詢以及程序處理，我們今天來了解一下使用vue2來實現(xiàn)常見的省市區(qū)下拉聯(lián)動選擇效果,需要的朋友可以參考下2018-11-11
使用vue-virtual-scroller遇到的問題及解決
這篇文章主要介紹了使用vue-virtual-scroller遇到的問題及解決,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教2024-03-03
這篇文章主要介紹了vue 項目中實現(xiàn)按鈕防抖方法,首先需要新建 .js文件存放防抖方法，引入防抖文件,methods中添加方法，本文結(jié)合示例代碼給大家介紹的非常詳細(xì)，需要的朋友可以參考下2022-12-12
這篇文章主要為大家詳細(xì)介紹了Vues實現(xiàn)跑馬燈效果，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們可以參考一下2021-10-10