vue 实现全屏和退出全屏的功能

最新推荐文章于 2024-09-02 15:50:40 发布

Little_Pig_Bug

最新推荐文章于 2024-09-02 15:50:40 发布

阅读量1w

点赞数 2

分类专栏： vue 文章标签：全屏退出全屏 vue

本文链接：https://blog.csdn.net/Little_Pig_Bug/article/details/83505316

版权

本文探讨了在Vue项目中如何实现全屏及退出全屏功能，但在实际应用中遇到了文字提示被遮挡的bug。尽管目前尚未找到消除提示的方法，作者询问读者是否遇到相似问题。

摘要由CSDN通过智能技术生成

<span class="icon-contain" @click="getFullCreeen">
     <svg-icon icon-class="quanping" />
</span>

export default {
    name:'topHeader',
    data(){
       return{
           n:0
       }
    },
    methods:{
        getFullCreeen(){
            this.n++;
            this.n%2==0? 
            this.outFullCreeen(document):this.inFullCreeen(document.documentElement)
        },
        inFullCreeen(element){
            let el = element;
            let rfs = el.requestFullScreen || el.webkitRequestFullScreen ||
                el.mozRequestFullScreen || el.msRequestFullScreen;
            if (typeof rfs != "undefined" && rfs) { 
                rfs.call(el);
            } else if (typeof window.ActiveXObject != "undefined") {
                let ws