问题描述:ios某些版本和机型下,如果页面存在position:fixed的弹层,会出现弹层里的按钮无法点击或者点击错乱的情况。
问题排查:通过百度和自己做了一个debug的工作,大概的问题是因为这样的弹层在弹出的时候会导致页面被撑开一定的高度,然后弹层的实际位置和视觉效果就产生的差别,事实上利用手机端的另外一个棘手的问题:滑动穿刺 是可以伪解决问题的,只需在页面上上下滑动一下,就会发现弹层可以正常点击了。
解决:由于本人并不是专业的前端,无法深入原理去解决,这里只做了一个折中的方案,利用window.scroll()事件来解决,在弹层弹出时监听事件,将页面滚动条滚动只顶部下10px即可,当然这个数值可以根据实际情况进行调整。jquery下使用$(window).scrollTop() vue下无法使用$,可直接使用window.scroll()来处理。
PS:如果有老哥们知道根本的解决方案,可以教一下小老弟。