移动h5开发中遇到的问题

Posted 2021-03-17 fqh123

1、输入框触发输入法后，完成输入，页面不回弹，这在ios手机上很常见，解决办法是，在输入法失去焦点是，上让页面抖动一下，网上很多的解决办法，具体就不说了，（时机可以自己把握，只要是完成输入法，就可以让页面抖动一下）；

2、ios上，当用absolute将底部栏定位到底部时，向上拖动页面，底部栏会跟着网上被拖动，解决办法是，用固定定位，将底部栏定位到底部

3、ios上，当页面中有滚动元素时，并且有固定定位的元素，手指从固定定位的元素，滑动到滚动元素上，导致滚动元素失灵，这样的问题，可以将鼎城元素用固定定位，就可以解决这个问题。

　　补充：必须要等整个页面停稳了才能滚动区域，影响到体验。这应该是ios系统自带的缓动效果，当用户拖动页面元素时给了一个回弹吸顶的效果，显得更加柔和，但有时候我们是不需要的。

　　问题的核心就是要组织滚动固定元素时防止整个页面脱离顶部，出现白色的背景。使用e.preventdefault()是不管用的，最终发现一个很简单的方法，就是给当前页面的顶层元素设置一个css样式：

　　

.fixed{
    position: fixed;
    left: 0;
    top: 0;
  }