fullpage 中输入框弹起 页面上移问题处理

fullpage页面要是有输入框的话  点击输入框 键盘弹出的时候会把输入框也顶起来 页面就会向上移 但是键盘收回的时候页面还是上移的状态

对于这个问题只在android手机上出现  为了解决这个问题 我想到一个方法

fullpagejs 会自动在页面生成一个类名为 fp-section 的外层标签 只需在键盘弹出的时候改变这个div的位置 向上移一定百分比 键盘收回的时候返回原来位置就可以

下面是代码

//判断是否是android
    var u = navigator.userAgent;
    var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1; //android终端
    //android处理输入框问题
    if (isAndroid) {
      var clientHeight = document.documentElement.clientHeight || document.body.clientHeight; //最初进来的窗口高度
      $(window).on('resize', function() {
        var nowClientHeight = document.documentElement.clientHeight || document.body.clientHeight; //变化后窗口的高度
        if (clientHeight > nowClientHeight) {
          //键盘弹出事件处理
          $('.fp-section').css('top', '-28%');
        } else {
          //键盘收起事件处理
          $('.fp-section').css('top', '0');
        }
      });
    }

 

转载于:https://www.cnblogs.com/luffyc/p/9172021.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值