提问者:小点点

IOS10全屏safari Javascript


当用户点击网站上的一个按钮时,我试图使div全屏运行。

唯一的问题是,除了iOS上的Safari之外,每个浏览器似乎都想工作。

我需要做什么才能使它全屏? 我试过调查,但什么也找不到。

下面是我当前的代码:

<script type="text/javascript">
function goFullscreen(id) {
    var element = document.getElementById(id); 

    var isInFullScreen = (document.fullscreenElement && document.fullscreenElement !== null) ||
        (document.webkitFullscreenElement && document.webkitFullscreenElement !== null) ||
        (document.mozFullScreenElement && document.mozFullScreenElement !== null) ||
        (document.msFullscreenElement && document.msFullscreenElement !== null);

    var docElm = document.documentElement;
    if (!isInFullScreen) {
        if (element.requestFullscreen) {
            element.requestFullscreen();
        } else if (element.mozRequestFullScreen) {
            element.mozRequestFullScreen();
        } else if (element.webkitRequestFullScreen) {
           element.webkitRequestFullScreen();
        } else if (element.msRequestFullscreen) {
            element.msRequestFullscreen();
        }
    } else {
        if (document.exitFullscreen) {
            document.exitFullscreen();
        } else if (document.webkitExitFullscreen) {
            document.webkitExitFullscreen();
        } else if (document.mozCancelFullScreen) {
            document.mozCancelFullScreen();
        } else if (document.msExitFullscreen) {
            document.msExitFullscreen();
        }
    }
}
</script>

共1个答案

匿名用户

正如很多帖子上提到的,在Safari和Chrome中,在IOS>=10上是无法切换到全屏的。 这是因为不支持全屏API:

  • 我可以使用全屏API吗
  • 在iOS上的Safari中全屏打开网页
  • 全屏api HTML5和Safari(IOS6)

你有两个可能的窍门:

  • 通知用户切换到横向模式。 实际上,您不能对此进行硬编码,iOS Chrome也不能这样做(防止iOS Safari中的方向更改)。
  • 如果您的网页是在web应用程序中导出的,并且您正确配置了meta balizes(为iOS优化全屏移动web应用程序)。