用户更新ios 16.4后程序页面里边fixed定位的底边栏在页面有滚动操作后,底部栏就隐身了,看不见但是可以点?

在ios模拟器中控制台直接修改底边栏的行内样式,也是照样隐身,请问有没有人跟我遇到过一样的情况?如何解决?

阅读 3.6k
3 个回答

组件是否有-webkit-overflow-scrolling:touch 如果有尝试禁用看看

这个问题可能是由于 iOS 16.4 更新后对 Safari 的 fixed 定位元素处理方式发生了变化所导致的。您可以尝试以下几种解决方案:

使用 position: sticky 替代 fixed 定位元素。position: sticky 在滚动到特定位置时将元素固定在屏幕上方或下方,通常会比 fixed 定位更可靠。

将 fixed 元素的 z-index 属性设置为较高的值。在某些情况下,fixed 元素可能被其他元素遮挡,因此您可以尝试使用 z-index 属性将其置于最上层。

将 fixed 元素的 transform 属性设置为 translateZ(0)。这将启用硬件加速,提高 fixed 元素的性能和可靠性。

新手上路,请多包涵

1:fixed定位目前对于新IOS系统兼容性差,不建议再使用该方案
2:修改表单页面布局方式,考虑使用flex 垂直布局方式
<div class='pageBody'>

   <div class='js_show'>表单内容</div>
   <div class='js_button'>底部按钮</div>

<div>
.pageBody{

   height: 100vh; 
   position: relative; 
   overflow-y: hidden; 
   display: flex; 
   flex-direction: column;
}

.js_show{
  overflow: auto; 
  flex:1;
}

.js_button{
  position: relative; 
}

3:禁用IOS原生的 _self.webView.scrollView.bounces = NO; 回弹效果

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题