[BUG] 微信浏览器 iOS input 失焦页面不回弹

描述

IOS13.

IOS设备中,input唤醒软键盘后,body整体会向上滚动,如果input框输入完成确定后,如果页面在最底部则不回弹,导致fixed布局实际效果上移,fixed布局内按钮点不到。

如图

解决方案

input onblur 让body滚动,页面回弹

function inputBlur() {
  if (/iphone|ipad|ipod/.test(navigator.userAgent.toLowerCase())) {
    let speed = 1;
    setTimeout(function () {
      var currentPosition = document.documentElement.scrollTop || document.body.scrollTop;
      currentPosition -= speed;
      window.scrollTo(0, currentPosition); // 页面向上滚动
      currentPosition += speed;
      window.scrollTo(0, currentPosition); // 页面向下滚动
    });
  }
}

解决方案在线演示


posted @ 2020-03-06 14:46  whosmeya  阅读(309)  评论(0编辑  收藏  举报