在移动浏览器上隐藏地址/导航栏而无需滚动内容？

文章/答案/技术大牛

发布

1回答

mobile、scroll

一段时间以来，我一直在制作和维护一个web-app，它有全屏单页设计，并在单独的容器中显示项目列表，因此没有在Safari和Chrome等移动浏览器上通常会触发地址和导航栏隐藏的经典滚动行为。因此，当在智能手机浏览器上使用此web应用程序时，顶部地址栏和底部导航栏始终可见。这在大尺寸的5+英寸手机上不是什么大问

浏览 63提问于2019-04-02得票数 5

1回答

有没有办法在滚动时隐藏浏览器，如果主体不是滚动的内容？

javascript、css、html

我有一个页面，它有一个中心div，它是所有内容的保持者(我需要这个以便页面居中，并且有一个持久的顶部和底部导航)，然而，我现在不能做的是，当我在移动浏览器中向下滚动时(如果页面本身正在滚动)，我不能让它滑动地址栏因为滚动的是div的内容，所以浏览器的地址栏仍然存在。我很好奇，当这个div从顶部坐标向下滚动时，是否可以发出一个手

浏览 2提问于2015-01-19得票数 0

1回答

由于浏览器地址栏不断改变div的高度，页面非常跳跃

javascript、jquery、html、css

我有下面的html，这基本上是一个屏幕上的3个页面，以允许滚动。这3个容器div的高度都是100%。它在桌面上看起来不错，但在移动设备上，浏览器的地址栏在滚动时总是隐藏起来。这会导致所有div改变大小，因为有地址栏的高度与没有地址栏的高度不同。这使得事情变得非常紧张，一般来说，这是一次可怕的经历。如何1)将div设置为视图的10

浏览 0提问于2014-09-19得票数 2

1回答

隐藏iPhone Safari浏览器中的底部控件栏

html、iphone、safari

有没有办法在移动设备上隐藏底部导航栏？(Safari和Android浏览器)？我不希望用户单击“后退按钮”返回到上一页。这是可行的吗？我读过关于将页面添加到主屏幕的内容，但那是在2012年。我可以使用HTML或javascript以某种方式隐藏此栏，而无需将页面添加到主屏幕吗？

浏览 0提问于2013-09-20得票数 0

1回答

三星安卓浏览器中的“自动隐藏工具栏”会中断不可滚动的页面(SGS5/Lollipop)

hide、toolbar

我们发现三星安卓浏览器(在SGS5，安卓5.0版本上测试)的“自动隐藏工具栏”功能存在问题。它是默认启用的，并在页面向上滚动时显示地址栏(在页面向下滚动时隐藏)。然而，它破坏了没有可滚动内容web应用程序。例如，在我的网页游戏地址栏中的每一个向上/向下滑动的手势都是显示/隐藏</e

浏览 1提问于2015-05-29得票数 0

2回答

在android中使用chrome的移动设备中，当我向下滚动模式，地址栏消失时，底部会出现空白。

javascript、html、jquery、css、twitter-bootstrap

class="img-fluid lazyload" style="width: 40px; height: 40px;" alt="next button" /></div>在android中使用chrome的移动设备中，当我向下滚动模式，地址栏消失时，底部会出现空白。这不会发生在任何其他浏览器上，比如android中的mozi

浏览 43提问于2020-05-14得票数 1

8回答

如何隐藏手机浏览器的地址栏？

javascript、mobile-browser、address-bar

移动设备上的Safari和Chrome在页面加载时都包含一个可见的地址栏。当页面的body滚动时，这些浏览器会将地址栏滚动到屏幕之外，从而为网站提供更多空间，如下图所示：我遇到了一个小问题，我的网站允许这样做。如果我触摸导航栏并向上拖动它，地址栏就会移出屏幕。这两种方法似乎都不直观。我想有一种方法，我可以使用javascript<e

浏览 5提问于2016-05-23得票数 50

1回答

防止在移动浏览器上自动隐藏地址栏

css、address-bar、mobile-chrome

然而，在移动浏览器上，这会导致糟糕的UI，因为随着地址栏的隐藏/显示，视口高度会增加/减少(如在Chrome上)。有没有办法防止在滚动中自动隐藏地址栏？

浏览 8提问于2016-06-26得票数 3

回答已采纳

3回答

隐藏iPhone上的地址栏

iphone、ios5

我在网上看到过很多关于通过向下滚动隐藏地址栏来隐藏地址栏的脚本，但我注意到苹果实际上完全隐藏了它，就像让它消失一样！我该怎么做呢？谢谢

浏览 1提问于2011-12-30得票数 1

回答已采纳

1回答

在iPhone/Android上隐藏地址栏

javascript、jquery、responsive-design

下面的脚本正在移动上隐藏地址栏，但没有隐藏显示/桌面上的地址栏。这是我想要的结果，但我不明白为什么会这样。我猜这也会把地址栏隐藏在所有的设备上。有更好的方法隐藏地址栏吗？

浏览 3提问于2013-08-03得票数 0

回答已采纳

4回答

强制地址栏显示在移动Chrome应用程序中

javascript、jquery、css、google-chrome、mobile

大多数应用程序已经禁用滚动，但是一个全屏幕面板需要是可滚动的。如果用户在应用程序中可滚动的部分，并向下滚动，地址栏将消失。如果地址栏消失后，用户决定通过单击固定位置菜单栏上的X退出该面板，则地址栏永远不会被触发(因为向上滚动从未发生)，因此用户陷入无滚动地址栏状态。我的问题：是否有

浏览 5提问于2014-08-14得票数 20

8回答

iOS 8删除了“minimal”视图属性，还有其他“软全屏”解决方案吗？

javascript、ios、css、responsive-design、mobile-safari

我们目前正在构建一个响应web应用程序(新闻阅读器)，允许用户在选项卡式内容之间滑动，以及在每个选项卡内容内垂直滚动。这种方法很好，但有一个主要缺点：，因为文档的高度与浏览器视图完全相同，移动浏览器将不会隐藏地址栏/导航菜单。昨天传来消息称，iOS 8 beta4已经将minimal-ui从Mobile中删除(参见中的Webkit部分)，这让我们感到疑惑： Q1.是否仍然

浏览 15提问于2014-07-22得票数 200

回答已采纳

2回答

如何限制移动站点的滚动，但允许访问可能被收回的地址栏

javascript、css、angularjs、mobile

我在构建移动站点时遇到了一个有趣的问题。当抽屉被切换时，我将“溢出:隐藏；”设置为html/body。然而，由于这是一个网站，不一致的溢出设置会造成浏览器的“全屏模式”的可用性问题。“全屏幕模式”是指地址栏在向下滚动页面时被隐藏起来。当滚动时，条形图将重新出现。当切换抽屉时，浏览器基本上被锁定在“非全屏模式”或“全屏模式”中。后者才是真正的问题--因为用户根本无法访问<

浏览 7提问于2014-01-12得票数 7

1回答

禁用jQuery移动地址栏隐藏

jquery、jquery-mobile

有没有办法禁用自动隐藏地址栏的jQuery移动功能？如果没有，有没有我可以实现的变通方法。我的问题是，我的web应用程序用户滚动，所以我可以有一个固定位置的页脚菜单栏。当地址栏被隐藏时，所有的内容都会向上移动，在底部留下一个空间。我可能会强制它向下移动，但用户没有办法向上滚动来访问地址栏，因为我的应用程序禁用了

浏览 0提问于2011-12-15得票数 2

回答已采纳

2回答

Android Chrome浏览器地址栏移动固定元素命中区域

javascript、html、css、google-chrome、android-chrome

似乎Android有一个相当大的缺陷，有时地址栏隐藏/显示会导致固定元素根据浏览器的地址栏高度向下/向上移动它们的边界框。因此，元素在视觉上停留在相同的位置，然而，包围框实际上是移动的。这个bug是间歇性的，但是我能够非常可靠地复制它，方法是快速滚动，然后突然停止滚动触摸屏幕。有没有其他人遇到过这种情况，更重要的是，是否有人有避免这种行为的解决

浏览 2提问于2018-06-19得票数 43

1回答

移动safari: window.pageYOffset / scrollY似乎忽略了导航栏的高度，即使它滚动

javascript、mobile、safari、mobile-safari

我已经关闭了调试控制台，也关闭了它，这样就不会在移动浏览器中添加任何额外的空间，从而执行警报()而不是console.log()。3.我试着在没有超时的情况下执行window.scrollTo()，直到我添加了超时，它才失败。无论如何，这不是问题所在。我的导航栏隐藏了，这就是我想要的。3.因此，现在我的视口移动到0,0，并在滚动条上发出警报，我希望将手指向下(滚动)显示导航条的行为

浏览 3提问于2011-01-12得票数 3

回答已采纳

1回答

在uiwebview上垂直移动javascript按钮或菜单

javascript、iphone、uiwebview、iphone-sdk-3.1

我在处理uiwebview的触摸事件时遇到了很多问题，uiwebview用于隐藏/取消隐藏我的选项卡栏和导航栏。我想在uiwebview上放一个水平移动的按钮或一个小文本，它会随着用户的滚动而移动。如果用户触摸与用户滚动一起移动的按钮，我计划显示或隐藏导航和选项卡栏。这在uiwebview中是可能的吗

浏览 2提问于2010-08-03得票数 0

1回答

iOS移动狩猎-底部栏覆盖我的脚

ios、mobile-safari

iOS移动safari有当你向上滚动时进入视图的地址和底部导航条，并在向下滚动时隐藏/最小化。我的UI中有一个页脚，它隐藏在底部导航栏中，我不知道修复这个问题的最佳方法是什么。我可以使用javascript来检测我正在使用的浏览器，然后相应地编辑css，但是我想知道是否有更好的CSS唯一解决方案。

浏览 0提问于2015-07-21得票数 11

10回答

防止在移动浏览器中隐藏地址栏

javascript、android、css、google-chrome、safari

我目前在一个水平布局的网站上工作。使用javascript时，所有元素都是position:absolute。它们的大小是用window.innerHeight计算的。我的问题是，尽管元素不高于窗口的高度，但我可以向下滚动(地址栏的高度)。这在两个方面令人恼火。首先，它触发了window-resize事件，这是我当时既不想要也不需要的。其次，它不能很好地处理一些内容框，这些内容框的内容应该是垂直滚动的。有时我可以滚动方框，但有时会先<

浏览 5提问于2013-08-05得票数 41

1回答

移动浏览器上的全视口固定位置画布

javascript、css、resize、address-bar

我想使用canvas元素作为背景覆盖浏览器窗口的整个视口。我使用Javascript来设置width和height的canvas。当页面滚动和地址栏隐藏时会出现问题。地址栏滚动并在页面上留下一个空白。似乎没有地址栏移动的event，所以当地址栏消失时，我无法调整canvas的大小。我可以从知道三件事中获益：是否有检测地址栏<e

浏览 5提问于2017-05-10得票数 1

点击加载更多