【问题标题】:How to make chrome extension to be in full screen?如何使 chrome 扩展全屏显示?
【发布时间】:2012-06-27 22:26:39
【问题描述】:

我正在尝试将 chrome 扩展设置为全屏,但我能做的最大值是半角。不仅如此,它只是在底部给我一个滚动条.. 我怎样才能让它全屏显示?意思是,chrome浏览器的整个宽度? 谢谢!

【问题讨论】:

  • 您说的是浏览器操作弹出窗口?我不确定这些是否能够成为全角窗口。尝试 Fullscreen API,但即使这样也可能是不可能的。你可能想用你的扩展内容打开一个新标签。
  • 您应该在底部接受文森特·沙伊布的回答。这是正确、当前和“完全可操作”的答案。

标签: html css google-chrome-extension


【解决方案1】:

在所有浏览器的网页上通用,包括 msRequestFullscreen

addEventListener("click", function () {
    var
          el = document.documentElement
        , rfs =
               el.requestFullScreen
            || el.webkitRequestFullScreen
            || el.mozRequestFullScreen
            || el.msRequestFullscreen
    ;
    if (rfs) { rfs.call(el); } else { console.log('fullscreen api not supported');}
});

【讨论】:

    【解决方案2】:
    chrome.windows.update(windowId, { state: "fullscreen" })
    

    http://developer.chrome.com/extensions/windows.html#method-update

    【讨论】:

    • 但是当你退出全屏时,你的浏览器不会回到你之前进入的状态,如何解决??
    • 如果我想让它在另一个显示器上全屏显示怎么办?
    【解决方案3】:

    在您的扩展“background.js”脚本中:

    chrome.app.runtime.onLaunched.addListener(function (launchData) {
      chrome.app.window.create(
        // Url
        '/editor.html',
        // CreateWindowOptions
        {
                'width': 400,
                'height': 500
        },
        // Callback
        function(win) {
            win.contentWindow.launchData = launchData;
            win.maximize();
            win.show();
        });
    });
    

    【讨论】:

    • 它需要'app.window'权限,但是:“'app.window'只允许用于打包的应用程序,这是一个扩展。”
    【解决方案4】:
    addEventListener("click", function() {
        var
              el = document.documentElement
            , rfs =
                   el.requestFullScreen
                || el.webkitRequestFullScreen
                || el.mozRequestFullScreen
        ;
        rfs.call(el);
    });
    

    正如在post 中看到的那样

    【讨论】:

      【解决方案5】:

      你试过fullScreen API吗?

      【讨论】:

      • 嗯,直接链接到 chrome API 文档的答案仍然更适用于 chrome 扩展问题。
      猜你喜欢
      • 2014-06-07
      • 2015-10-20
      • 2015-04-10
      • 2015-10-16
      • 1970-01-01
      • 2017-05-12
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多