强制地址栏显示在移动 Chrome 应用程序中 [英] Force address bar to show in mobile Chrome app
问题描述
我正在开发一个网络应用.大多数应用程序都禁用了滚动功能，但需要可以滚动一个全屏面板.
问题:
如果用户位于应用的可滚动部分并向下滚动，则地址栏会消失.如果在地址栏消失后，用户决定通过单击固定位置菜单栏上的 X 退出该面板，则地址栏永远不会被触发(因为永远不会发生向上滚动)，因此用户会卡在滚动中- 禁用无地址栏状态.
我的问题:
是否可以强制触发地址栏在 Google Chrome 中显示?
链接！
滚动条自动隐藏:http://jsbin.com/yeyapijulo
在 Android 4.4.2(三星 Galaxy Tab 3)中的 Chrome Beta 44.0.2403.63 和 Chrome 43.0.2357.93 中测试.
I'm working on a web app. Most of the app has scrolling disabled, however one fullscreen panel needs to be scrollable.
The problem:
If the user is in the part of the app that's scrollable, and scrolls down, the address bar disappears. If, after the address bar disappears, the user decides to exit that panel by clicking an X on the fixed-position menu bar, then the address bar never gets triggered (because scrolling up never happens) and so the user is stuck in a scroll-disabled address-bar-less state.
My question:
Is it possible to force trigger the address bar to show in Google Chrome?
Links!
JSBin output
JSBin code
btw
Simply setting $(window).scrollTop(0) doesn't do it.
Emulating using dev tools doesn't work. You need to open it in a mobile device, in the chrome app.
Thanks!
Example below:
No scrolling allowed, address bar showing
)
Scrolling allowed, address bar showing
User scrolled, address bar hiding
Go back to scrolling-disabled div, address bar is hidden
One workaround is to use a div as a scrollable container for body content. This way the body is not scrollable, but the inner div and Chrome doesn't autohide the address bar when this inner div is scrolled:
<body style="margin:0;padding:0;width:100%;height:100%">
<div style="position:absolute;width:100%;height:100%;overflow:scroll">
Content
</div>
</body>
Scroll bar visible: http://jsbin.com/zibewepiwo
Scroll bar auto hide: http://jsbin.com/yeyapijulo
Tested in Chrome Beta 44.0.2403.63 and Chrome 43.0.2357.93 in Android 4.4.2 (Samsung Galaxy Tab 3).
这篇关于强制地址栏显示在移动 Chrome 应用程序中的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
