全屏切换在 iOS 手机/平板电脑（Safari、Chrome 和 Firefox）上不起作用

Question

我在 iOS 移动设备（iPhone 和 iPad，所有版本）上的 web 应用程序中遇到全屏模式问题。

我有一个按钮可以调用切换全屏功能。此功能适用于除 iOS 以外的所有设备。

我的功能：

    function toggleFullScreen(e) {
                if (!document.fullscreenElement && !document.mozFullScreenElement && !document.webkitFullscreenElement && !document.msFullscreenElement && !window.navigator.standalone) {  // current working methods
                    if (document.documentElement.requestFullscreen) {
                        document.documentElement.requestFullscreen();
                    } else if (document.documentElement.msRequestFullscreen) {
                        document.documentElement.msRequestFullscreen();
                    } else if (document.documentElement.mozRequestFullScreen) {
                        document.documentElement.mozRequestFullScreen();
                    } else if (document.documentElement.webkitRequestFullscreen) {
                        document.documentElement.webkitRequestFullscreen(Element.ALLOW_KEYBOARD_INPUT);
                    }
                    $('body').css({'height': screen.height});
                    fullSreen = true;
                } else {
                    if (document.exitFullscreen) {
                        document.exitFullscreen();
                    } else if (document.msExitFullscreen) {
                        document.msExitFullscreen();
                    } else if (document.mozCancelFullScreen) {
                        document.mozCancelFullScreen();
                    } else if (document.webkitExitFullscreen) {
                        document.webkitExitFullscreen();
                    }else if(document.cancelFullScreen){
                        document.cancelFullScreen();
                    }
                    $('body').css({'height': 'auto'});
                    fullSreen = false;
                }
    }

它不适用于 iOS 移动设备/iPad 上的 Safari、Chrome 和 Firefox，但功能是调用（我尝试使用一些警报消息）。我不明白为什么，提前谢谢！

Answer 1

您可以在http://caniuse.com/fullscreen上验证iOS Safari 不提供全屏 API，请检查此 asnwer 以了解更多信息 Full screen api HTML5 and Safari (iOS 6)。但 html 视频元素可以全屏显示。

看看https://brad.is/coding/BigScreen/，是一个很好的处理全屏事件的库。