代码之家  ›  专栏  ›  技术社区  ›  ypnos

网站是否可以强制浏览器进入全屏模式?

  •  12
  • ypnos  · 技术社区  · 17 年前

    实验是在网络上进行的,因此是在浏览器窗口中进行的。是否可以告诉浏览器进入全屏,例如按下按钮?

    我知道有可能打开一个固定大小的弹出窗口。你认为这是一个可行的选择吗?如果是,最好的方法是什么?是否有优雅的方法来检测弹出窗口拦截器,以回退并在原始浏览器窗口中运行研究。

    8 回复  |  直到 17 年前
        1
  •  8
  •   mqsoh    17 年前

    您可以告诉用户按F11键。在它旁边,放一个“为什么”链接,并解释为什么你觉得他们需要全屏模式。

    我认为你不能强迫浏览器全屏显示,事实上,如果你能做到这一点,我会对我的浏览器大发雷霆。这太有侵略性了。甚至Flash也有安全性,因此强制插件全屏显示需要通过用户交互发起事件。因此,如果这对你很重要,这可能是使用Flash插件的一个很好的理由,因为你可以将go全屏调用附加到一个误导性的按钮上,上面写着“开始测验”(或其他什么)。

    但是,请不要这样做。直接告诉用户,让他们点击F11。

    编辑:我刚刚尝试了另一条评论中提供的示例代码,我很高兴地说Firefox打开了一个带有地址栏的最大化窗口,而不是全屏窗口。

        2
  •  5
  •   Swen    12 年前

    我在搜索后找到了一些代码。

    function fullscreen() {
        var element = document.getElementById("content");
        if (element.requestFullScreen) {
            if (!document.fullScreen) {
                element.requestFullscreen();
                $(".fullscreen").attr('src',"img/icons/panel_resize_actual.png");
            } else {
                document.exitFullScreen();
                $(".fullscreen").attr('src',"img/icons/panel_resize.png");
            }
    
        } else if (element.mozRequestFullScreen) {
    
            if (!document.mozFullScreen) {
                element.mozRequestFullScreen();
                $(".fullscreen").attr('src',"img/icons/panel_resize_actual.png");
                google.maps.event.trigger(map, 'resize');
            } else {
                document.mozCancelFullScreen();
                $(".fullscreen").attr('src',"img/icons/panel_resize.png");
            }
    
        } else if (element.webkitRequestFullScreen) {
    
            if (!document.webkitIsFullScreen) {
                element.webkitRequestFullScreen();
                $(".fullscreen").attr('src',"img/icons/panel_resize_actual.png");
                google.maps.event.trigger(map, 'resize');
            } else {
                document.webkitCancelFullScreen();
                $(".fullscreen").attr('src',"img/icons/panel_resize.png");
            } 
        } 
    }
    

    它将使用HTML5API。我用jquery为它切换了一张特殊的图片。希望这会有所帮助。目前,我不知道你是否能强迫它,因为它是出于安全考虑而被禁止的。

        3
  •  5
  •   Darryl Hein IrishChieftain    17 年前

    无法将当前窗口调整为全屏,但您可以全屏打开弹出窗口:

    <script type="text/javascript">
    <!--
    function popup(url) 
    {
     params  = 'width='+screen.width;
     params += ', height='+screen.height;
     params += ', top=0, left=0'
     params += ', fullscreen=yes';
    
     newwin=window.open(url,'windowname4', params);
     if (window.focus) {newwin.focus()}
     return false;
    }
    // -->
    </script>
    
    <a href="javascript: void(0)" 
       onclick="popup('popup.html')">Fullscreen popup window</a>
    
        4
  •  4
  •   micahwittman    17 年前

    在IE上以全屏模式打开新窗口:

    <script>
    <!--
    window.open("page.html","fs","fullscreen,scrollbars")
    //-->
    </script> 
    

    在page.html上添加“Close”链接可能是个好主意:

    <a href="#" onclick="window.close()">Close Window</a>
    
        5
  •  2
  •   James Curran    17 年前

    在过去,我看到过这样的网站。然而,由于它令人难以置信地恼火,并且通常被pr0n网站的广告使用,该技术可能会在最近的浏览器中被阻止。

        6
  •  1
  •   Darryl Hein IrishChieftain    17 年前

    要修改父窗口,请尝试以下操作:

    window.opener.location.href = '/confirmation/page.html';
    
        7
  •  0
  •   Scottie T    17 年前

    F11将IE和Firefox带入全屏模式。我确信它可以全屏显示,因为YouTube和其他视频流网站可以用Flash实现,但我不知道如何使用javascript。

        8
  •  0
  •   Swen    12 年前

    对于支持全屏显示的移动浏览器来说,此功能更有趣。大多数移动浏览器不会通过点击一个选项来全屏显示。您需要切换到全屏,以获得一点应用程序的感觉。