6

我花了很多时间尝试 jquery/javscript "fix" 来完成这项工作。自上次 chrome mobile for IOS 更新以来，浏览器的地址栏行为有所不同。我相信你们都知道我在说什么：向下滚动页面，栏会隐藏起来，但是一旦向上滚动，它就会出现。是的，我可以说这是一个很好的用户体验。

问题是我的网络应用程序顶部确实有固定元素（标题），每次向上滚动时，地址栏都会越过我的固定元素。

我查找了其他网络应用程序（twitter、gmail），他们似乎找到了避免这种情况的方法。我想阅读您对他们如何实现它的想法。没有必要告诉我不要使用固定元素。

所以我的问题是：有没有办法避免这种情况？你对这种情况有什么看法。

示例：https ://mobile.twitter.com/EmWatson （最好在 iphone 上查看）

仅供参考：我为我的网络应用程序使用 Jquery 移动框架。

谢谢。

4

1 回答 1

2

嗯，我找到了工作的方法。

<body style="overflow:hidden;">
    <header style="width:auto;display:block;padding:12px;text-align:center;background-color:#1276c7;color:white;position:fixed;top:0;left:0;right:0;opacity:1;">FIXED HEADER</header>
    <div role="main" style="height:100%;overflow-y:scroll;padding:60px 0;box-sizing:border-box;-webkit-overflow-scrolling: touch;">
            <article>

                  ...(content)...

            </article>
     </div>
 </body>

看来我们需要一个内部可滚动元素并删除 body 上的溢出。我想多了，好像。希望这可以帮助某人。

于 2013-09-13T17:32:31.533 回答