最近做視頻播放,要求點擊圖片全屏播放視頻,視頻退出全屏顯示圖片,所以需要對video退出全屏事件進行處理,以下js方法親測有效,測試瀏覽器(fireFox,GoogleChrome,MS.Edge,搜狗等)

<script src="https://libs.baidu.com/jquery/1.11.3/jquery.min.js"></script>
<script>
    //jQuery監(jiān)聽事件(窗口狀態(tài)改變)
    $(window).resize(function () {
        if (checkIsFullScreen()) {
            console.log("進入全屏");
        } else {
            console.log("退出全屏");
        }
    });
    //js監(jiān)聽事件(全屏狀態(tài)改變)
    /*document.addEventListener('fullscreenchange', () => {
        if (checkIsFullScreen()) {
            console.log("進入全屏");
        } else {
            console.log("退出全屏");
        }
    });*/
    //上面2個監(jiān)聽事件可根據項目需求2選1,然后調用此檢測全屏方法
    function checkIsFullScreen(){
        var isFullScreen = document.fullscreen || document.mozFullScreen || document.webkitIsFullScreen;
        return isFullScreen == undefined ? false : isFullScreen;
    }
</script>