ios 上h5点击无效_ios手机轻触几下屏幕出现白底的bug

场景：安卓和ios需要嵌套我的H5页面，其中html中设置了禁止缩放事件user-scalable=no，也设置成positiona:fixed,bottom:0固定页面，安卓手机上不会出现问题，但是在ios上会出现的问题是点击几下屏幕会出现白边

注意：不是一进来页面出现白边，是点击几下屏幕之后底部出现白边的bug，由于没有办法返现出来bug,索性自己画了一下，如下图：

后来查了查资料问了问大佬，提供了一个解决思路：

解决思路：禁止轻触事件，但是这种思路下会有一个bug就是所有的功能都没法点击了，所以思路就要改为：功能性的按钮设置成能点击，对于打卡按钮的样式中，添加pointer-events属性，而其他区域点击无效

首先需要介绍一下pointer-events属性是什么

pointer-events属性是一个指针属性，是用于控制在什么条件下特定的图形元素可以成为指针事件的目标。

pointer-events属性有很多值，但是对于浏览器来说，适用于HTML元素的只有三个值，其它的几个值都是针对SVG元素的

pointer-events: visiblePainted | visibleFill | v