Question

有谁可以告诉我为什么使用外部按钮的webkitEnterFullscreen（）在Chrome和Safari中有效，而不是iOS？

在iOS中，即使我将视频设置为“可见”，该按钮也不起作用。它似乎只在视频播放后才能工作，然后它将允许我启动全屏。我不能通过使用“this.play（）;”来编写脚本，它只能在人类点击播放按钮时起作用。

我正在使用iPad 2和iOS 5.0.1

<html>
    <head>
        <title>Fullscreen Video</title>
        <script src="js/jquery-1.7.1.min.js"></script>
        <script type="text/javascript">

            $(function(){
                // hide video
                $("#myVideo").css({'visibility' : 'hidden', 'display' : 'none'});

                // extend button functionality
                $('#fs').bind('click', function() {
                    // display the video
                    $("#myVideo").css({'visibility' : 'visible'});

                    // launch the video fullscreen
                    $("#myVideo")[0].webkitEnterFullscreen();
                });
            });
        </script>

    </head>
    <body>

        <h1>Fullscreen Video</h1>
        <video id="myVideo" width="852" height="480" controls="false" preload="false">
            <source src="videos/myVideo.mp4" type='video/mp4' />
        </video>
        <br />
        <input type="button" id="fs" value="Fullscreen">

    </body>
</html>

Answer 1

当您覆盖“display: none”时，不应该覆盖“visibility: hidden”吗？

我将视频放在屏幕上（-2000与position: absolute），我使用：

<script>

var videoPlayFullscreen = function() {
       $('video').get(0).play();        
       $('video').get(0).webkitEnterFullscreen();  
    };

</script>

在我使用“.get(n)”之前，我无法让它发挥作用。（可能与您正在做的事情相同：$('video')[n]。

但是我的全屏只有在视频播放时才有效，就像你的一样，但上面的代码可以在iphone4和iPad第一代上播放。

我的问题：在iPad第一代上，视频在第一次点击时播放（第一次运行videoPlayFullscreen功能）并在第二次点击时进入全屏（第二次运行该功能）。我认为它还没有准备好立即进行全屏，所以可能在此之前有一段延迟时间？

播放代码适用于iPhone 4（根据我的经验，它只启动全屏而不使用/需要webkitEnterFullscreen。）

使用外部按钮的webkitEnterFullscreen（）适用于Chrome和Safari，但不适用于iOS

1 个答案: