收藏
回答

iOS真机,子组件内的节点绝对定位无法覆盖父组件中的节点

问题模块 框架类型 问题类型 操作系统 操作系统版本 手机型号 微信版本
客户端 小程序 Bug iOS 12.0.1 iphone 6s 7.0.10

请使用ios真机测试。


今天测试发现,总结出来是

-webkit-overflow-scrolling: touch;

导致的问题。

<view class="flex">
  <view class="flex-content">
    <view class="fixed"></view>
  </view>
  <view class="flex-bottom"></view>  
</view>

.flex {
  display: flex;
  flex-direction: column;
  height: 100%;
  position: relative;
  overflow: hidden;
  .flex-content {
    flex: 1;
    overflow-y: scroll;
    -webkit-overflow-scrolling: touch;  // 该样式造成.fixed节点无法覆盖在 .flex-bottom 节点之上
    .fixed {
        width: 100%;
        height: 80%;
        background-color: #fff;
        position: fixed;
        left: 0;
        bottom: 0;
        z-index: 100;
    }
  }
  .flex-bottom {
    height: 120rpx;
    background-color: #fff;
  }
}
最后一次编辑于  02-02
回答关注问题邀请回答
收藏

1 个回答

  • 社区技术运营专员-灵芝
    社区技术运营专员-灵芝
    02-03

    你好,-webkit-overflow-scrolling: touch;  iOS 下是会影响 fixed 的,请开发者自行规避,把 Fixed 节点提出来

    02-03
    赞同
    回复
登录 后发表内容
问题标签