如何隐藏移动浏览器的地址栏？ [英] How to hide a mobile browser's address bar?
问题描述
移动设备上的Safari和Chrome浏览器在页面加载时都包含可见的地址栏。当页面的正文滚动时，这些浏览器将在屏幕外滚动地址栏，以向网站提供更多房地产，如下图所示：
Safari and Chrome on mobile devices both include a visible address bar when a page loads. As the body of the page scrolls, these browsers will scroll the address bar off screen to give more real estate to the website as shown in this image:
我遇到了一个问题我的网站允许这样做。我正在研究一个Pokedex，其中包含所有Pokemon的很长的列表。但是，通过我设置页面的方式，它并不想滚动地址栏。
I'm running into a bit of an issue with my site allowing this. I'm working on a Pokedex that contains a very long list of all the Pokemon. However, with the way I've set up the page it doesn't want to scroll the address bar out of sight.
我的html看起来像：
My html looks like:
<body>
<app> <!-- My Angular2 tag for the app, no special styles for this -->
<nav>...</nav> <!-- The red nav bar and hamburger menu, default bootstrap -->
<div class="fluid-container">...</div> <!-- The container for all pokemon entries -->
</app>
</body>
如果我滚动到列表的绝对底部（即721个条目），那么任何更多的滚动都将移动屏幕顶部的地址栏。如果我触摸导航栏并将其向上拖动，则地址栏将移出屏幕。这两种方法似乎都不直观。
If I scroll to the absolute bottom of the list (that's 721 entries) then any more scrolling will move the address bar off the top of the screen. If I touch the navbar and drag it upward then the address bar moves off screen. Both of these seem unintuitive ways to do this.
我想我可以通过某种方式使用javascript滚动页面正文来隐藏它，但是到目前为止我尝试过的方法不起作用。当我这样做时，没有可见的滚动。
I imagine there's some way I scroll the body of the page using javascript that will hide it but what I've tried so far doesn't work. No visible scrolling took place when I did that.
如何在页面加载后立即滚动页面以隐藏移动浏览器的地址栏？
How can I scroll the page enough to hide a mobile browser's address bar shortly after the page loads?
编辑：我研究的越多，没有用户交互似乎越不可能做到。如果我需要用户交互，是否可以让用户在屏幕中央的触摸首先尝试滚动正文，然后再尝试滚动包含所有条目的div？如果这样做符合我的想法，则它将先滑动地址栏，然后再滑动列表。这与默认浏览器行为的相反，因此可能不可能/容易/可靠，但是我愿意尝试看看是否有人有任何想法。
The more I look into this, the more impossible it seems to do it without user interaction. If I require user interaction, would it be possible for a user's touch in the center of the screen to first attempt to scroll the body before attempting to scroll the div with all the entries in it? If this works the way I'm thinking then it would first slide the address bar out of the way before sliding through the list. It's kind of the reverse of the default browser behavior so it may not be possible/easy/reliable, but I'm willing to try and see if anybody has any ideas.
推荐答案
我知道这很旧，但是我必须在这里添加它。.
I know this is old, but I have to add this in here..
虽然这不是一个完整的答案，这是必须添加。
And while this is not a full answer, it is an 'IN ADDITION TO'
如果您不使用https，则地址栏不会消失。
The address bar will not disappear if you're NOT using https.
ALSO
如果您使用的是https，但地址栏仍然无法隐藏，则您的网页中可能会有一些https错误（例如，某些图片已投放）
If you are using https and the address bar still won't hide, you might have some https errors in your webpage (such as certain images being served from a non-https location.)
希望这会有所帮助。
这篇关于如何隐藏移动浏览器的地址栏？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
