safari下页面无法滑动问题

  最近项目中遇到了个很蛋疼的问题，困扰了很久，甚至最后采取了模拟scroll的办法。

首先是个基于vue项目，很多一些地方需要滑动，就直接用了overflow：auto或者scroll，比如这样

本来吧，应该都是没什么问题的。我的手机是安卓的，所以开发时也都没问题，chrome上模拟的也没问题。 但公司测试的时候问题来了，居！然！划！不！动！了！

阻止浏览器默认事件，取消定位，消除浮动。能想到的都搞了一遍。 然并卵！！

这个时候想到会不会是兼容问题，最后发现是因为mescroll默认给了body样式 “-webkit-overflow-scrolling:touch”

直接说重点：  加了此属性，特定情况会导致safari下出现页面卡死问题，即不能滑动。本身这属性是为了解决Safari下滑动不顺畅的痛点，但也带来了很多坑。

BUG原因： 用了这属性的标签，不要加！定！位！。 举个栗子，body下加了这个，那么你网页中所有想用溢出滚动的地方都不可以加定位，否则就可能出现卡死情况，哪怕是你body下再加了一个盒子也不行。

解决方案：使用第三方库，如mescroll，iscroll等。 或者嫌项目臃肿或者用不到很多，就直接自己模拟。 其实最简单的就是尽量避免定位布局