javascript - GWT：隐藏移动设备上的地址栏

Question

我试图在移动设备上隐藏我的 GWT 应用程序的地址栏。从我的移动代码中，我正在调用下面的 JSNI 函数，但它不起作用。您能想到的任何不涉及 JQuery 的解决方案？

public static native void hideBar()
/*-{
    $($doc).ready(function() {
        function hideAddressBar() {
            if($doc.documentElement.scrollHeight < $wnd.outerHeight / $wnd.devicePixelRatio) {
               $doc.documentElement.style.height = ($wnd.outerHeight / $wnd.devicePixelRatio) + "px";
            }
        }

        $wnd.addEventListener("load", function() { hideAddressBar(); });
        $wnd.addEventListener("orientationchange", function() { hideAddressBar(); });
    });
}-*/;   

Answer 1

为什么不让你的应用全屏呢？

您必须考虑不同的实现（webkit 与 gecko 前缀、方法命名与 W3C 标准不同等），但这似乎是您的情况。

而不是hideAddressBar(), 有一个goFullScreen(), ruffly 这样做：

function goFullScreen() {
    var docElm = $doc.documentElement;
    if (docElm.requestFullscreen) {
        docElm.requestFullscreen();
    } else if (docElm.mozRequestFullScreen) {
        docElm.mozRequestFullScreen();
    } else if (docElm.webkitRequestFullScreen) {
        docElm.webkitRequestFullScreen();
    }
}

请参阅在 MDN 上使用全屏模式，以及在 hacks.mozilla.org 上的 Web 浏览器中使用全屏 API 。

还可以查看robnyman 的这个有用的要点，以便快速入门。