IOS下使用定位的子元素，不能覆盖使用定位的父元素平级元素；

IOS下使用定位的子元素，不能覆盖使用定位的父元素或父元素平级元素;

布局如下，由于业务需要，针对ios页面滑动卡顿问题，添加了css 属性-webkit-overflow-scrolling:touch 使页面滑动流畅，

-webkit-overflow-scrolling这个属性可以参考下面的文章：

https://www.cnblogs.com/xiahj/p/8036419.html

如上图所示，在实际业务中，由于对父容器使用了-webkit-overflow-scrolling：touch这个属性，在某些ios机型下，会出现定位的子元素无法覆盖父元素平级的定位元素的现象，也就是无论A元素使用多高的z-index.在显示的时候，仍然被B元素覆盖在下面。

经过查阅发现-webkit-overflow-scrolling：touch是会影响ios下父子定位元素的显示的。而使用-webkit-overflow-scrolling： auto就不会出现这样的问题

【解决方案】

第一种：直接去掉-webkit-overflow-scrolling： touch 【不合理，因为页面卡顿了】

第二种：把A元素和B元素放到一个平级下，就不会被覆盖，但是某些场景下是不适合的，比如需要从父元素传数据到子元素

第三种：使用挂载将A元素挂载到B元素的父节点或者更高的父节点

   比如vue下，对A元素使用 document.body.querySelector('#app').append(this.$el)

第四种，动态改变-webkit-overflow-scrolling： touch的值。

在控制A元素是否显示时控制style属性