当前位置： 移动技术网 > 移动技术>移动开发>IOS > 解决H5页面在iOS系统中滑动回弹效果(橡皮筋效果)导致的穿透问题

解决H5页面在iOS系统中滑动回弹效果(橡皮筋效果)导致的穿透问题

2020年08月14日  | 移动技术网移动技术  | 我要评论

        移动端开发时，H5长页面在iOS系统中滑动时，当页面滑动到顶部或底部时，页面还能够上滑或下滑，手指离开屏幕后回弹，这就时橡皮筋效果，单纯来说这个效果并没有什么问题，但是它对H5页面却并不友好，会导致穿透，导致H5页面出现被截断的假象；

参考了很多文章之后，我采用了如下办法，亲测好用：

使用插件inobounce（但是只适用于ios系统，安卓不适用）

下载插件：

npm install inobounce -s

在需要处理的页面上添加如下代码：

<script>
import inobounce from 'inobounce'
export default {
  data() {
    return {  }
  },
  mounted() { },
  created() {
    let u = navigator.userAgent
    if (u.indexOf('iPhone') > -1) {
      inobounce.enable()
    }
  },
  beforeDestroy() {
    inobounce.disable()
  },
  methods: { }
}
</script>

就可以完美解决了；

本文地址：https://blog.csdn.net/qq_41725450/article/details/107962899

您可能感兴趣的文章:

如对本文有疑问， 点击进行留言回复！！

相关文章:

验证码：
最近更新的文章
大家感兴趣的文章
移动技术网