[Chrome]点击页面元素后全屏

最新推荐文章于 2025-02-26 13:54:30 发布

weixin_30809173

最新推荐文章于 2025-02-26 13:54:30 发布

阅读量116

点赞数

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/z5337/p/8609541.html

本文提供了一种使用JavaScript实现网页全屏及取消全屏的方法，包括检查当前是否处于全屏状态、请求全屏和取消全屏的功能。同时介绍了通过修改桌面快捷方式命令实现强制全屏模式。

        function isFullScreen() {
            return (document.fullScreenElement && document.fullScreenElement !== null)
                 || document.mozFullScreen
                 || document.webkitIsFullScreen;
        }


        function requestFullScreen(element) {
            if (element.requestFullscreen)
                element.requestFullscreen();
            else if (element.msRequestFullscreen)
                element.msRequestFullscreen();
            else if (element.mozRequestFullScreen)
                element.mozRequestFullScreen();
            else if (element.webkitRequestFullscreen)
                element.webkitRequestFullscreen();
        }

        function cancelFullScreen() {
            if (document.exitFullscreen)
                document.exitFullscreen();
            else if (document.msExitFullscreen)
                document.msExitFullscreen();
            else if (document.mozCancelFullScreen)
                document.mozCancelFullScreen();
            else if (document.webkitExitFullscreen)
                document.webkitExitFullscreen();
        }

        function toggleFullScreen(element) {
            requestFullScreen(element || document.documentElement);
            cancelFullScreen();
        }

        $(document).ready(function () {
            $("#fullScreen").click(function () {
                toggleFullScreen(document.body);
            });

            $("#fullScreen").click();
        });