相关疑难解决方法(0)

(这是一个多部分的问题,我将尽力总结这个场景.)

我们目前正在构建一个响应式Web应用程序(新闻阅读器),允许用户在选项卡式内容之间滑动,以及在每个选项卡式内容中垂直滚动.

解决此问题的常见方法是使用一个包装器div填充浏览器视口,设置overflow为hidden或auto,然后在其中水平和/或垂直滚动​​.

这种方法很好,但有一个主要缺点:由于文档的高度与浏览器视口完全相同,因此移动浏览器不会隐藏地址栏/导航菜单.

有许多hacks和视口属性使我们能够获得更多的屏幕空间,但没有一个像minimal-ui(在iOS 7.1中引入)那样有效.

昨天有消息称iOS 8 beta4已从minimal-uiMobile Safari中删除(参见iOS 8发行说明中的 Webkit部分),这让我们感到奇怪:

Q1.是否仍然可以隐藏Mobile Safari上的地址栏？

据我们所知,iOS的7 不再响应的window.scrollTo破解,这意味着我们不得不忍受较小的屏幕空间,除非我们采取垂直布局或使用mobile-web-app-capable.

Q2.是否仍然可以获得类似的软全屏体验？

通过软全屏我真的意味着不使用mobile-web-app-capable元标记.

我们的Web应用程序可以访问,任何页面都可以使用本机浏览器菜单加入书签或共享.通过添加mobile-web-app-capable我们阻止用户调用这样的菜单(当它保存到主屏幕时),这会混淆和对抗用户.

minimal-ui曾经是中间地带,默认隐藏菜单但是通过点击可以访问它 - 虽然Apple可能已经删除它由于其他可访问性问题(例如用户不知道点击激活菜单的位置).

Q3.全屏体验值得一试吗？

似乎全屏API不会很快进入iOS,但即便如此,我也看不到菜单是如何保持可访问的(Android上的Chrome也是如此).

在这种情况下,也许我们应该保持原样的移动游猎,并考虑视口高度(对于iPhone 5 +,它是460 = 568 - 108,其中108包括操作系统栏,地址栏和导航菜单;对于iPhone 4或年纪大了,它是372).

很想听到一些替代方案(除了构建本机应用程序).

是否可以隐藏iOS 7中的地址栏？

我目前正在使用以下在iOS 6中执行此操作,但我刚刚更新了xCode并在iPhone Sim和iOS 7中测试了Safari没有对此做出响应.

JS:

window.addEventListener("load",function() {
    // Set a timeout...
    setTimeout(function(){
        // Hide the address bar!
        window.scrollTo(0, 1);
    }, 0);
});

window.scrollTo(0,1); 不起作用.更糟糕的是,地址栏只会移动一点,有时会被卡住一半.

我想知道在IOS7 safari中是否有一种控制地址栏和工具栏位置的方法.我基本上希望他们一旦页面加载到safari中就隐藏它们,而用户不必滚动页面来调用隐藏？