我正在一个非常“愚蠢”的特殊网站上工作。它应该非常华丽,有很多动画,并且在这方面是有反应的。 body元素设置为overflow: hidden;结构看起来像这样:
<div id="wrapper">
<div class="content"> Some content with down button goes here ...</div>
<div class="content"> Some content with up/down button goes here ...</div>
<div class="content"> Some content with up/down button goes here ...</div>
<div class="content"> Some content with up button goes here ...</div>
</div>
每个 .content 都有一个向上/向下导航按钮,可以将您滚动到每个 div。这些是完整的宽度和高度,如果内容“太大”,则 div 本身是可滚动的。也就是说,您“不能”通过继续滚动来滚动到下一个内容 - 您必须使用导航转到下一个 div。
由于调整大小会改变内容,因此 .content 的对齐可能会崩溃。也就是说,两个 content-div 是可见的(比如 #1 的 80% 和 #2 的 20%。因此我有一个功能可以“restes”页面并让你在调整大小时到达顶部(.content #1) .
这在台式机上(以及在 Android 上的 chrome 中)运行良好,但还有 iOS 和 safari。地址栏可见,经典的 window.scrollTo(0,0);
(或 window.scrollTo(0,1);
)将不起作用。美好的。我可以忍受这一点。但是,在某些情况下,当您在内容中滚动时,safari 只会想“嘿,让我们现在隐藏地址栏”(我还没有真正弄清楚这个逻辑是怎么回事),这被视为将您带到顶端。
那么,是否有任何聪明的方法可以始终保持地址栏可见,或者就此而言始终将其隐藏?
或者任何其他解决这个问题的想法?
最佳答案
我在使用 Chrome Mobile 时遇到了同样的问题。当我滚动时,地址栏消失,导致窗口调整大小事件触发。 解决方案是在滚动事件处于事件状态时阻止调整大小事件。
关于javascript - 在隐藏/显示地址栏上禁用 iphone 缩放/调整大小?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28439074/