软键盘弹起,导致底部被顶上去

计算出可视界面的高度,当软键盘弹起时让底部元素隐藏掉,

当键盘收起时再让它显示,实在没办法时这种方法也不失为一种方法

var h=document.documentElement.clientHeight;

$(window).resize(function(){

let height=document.documentElement.clientHeight;

if(h==height){

$(‘.bottom‘).css(‘display‘,‘block‘);

}else{

$(‘.bottom‘).css(‘display‘,‘none‘);

}

})

原文地址:https://www.cnblogs.com/liyue666/p/9778175.html

时间: 2024-10-06 23:40:25

软键盘弹起,导致底部被顶上去的相关文章

android全屏下的输入框未跟随软键盘弹起问题

最近开发中遇到,全屏模式下输入框在底部不会跟随软键盘弹起.于是网上搜索了解决的方案.大致找到了两种方案. 第一种 定义好此类 public class SoftKeyBoardListener { private View rootView;//activity的根视图 int rootViewVisibleHeight;//纪录根视图的显示高度 private OnSoftKeyBoardChangeListener onSoftKeyBoardChangeListener; public S

mui防止软键盘弹起方法

解决前 解决后 <!--防止软键盘调起时,底部内容随之挤上来--> <script type="text/javascript"> //获取原始窗口的高度 var originalHeight = document.documentElement.clientHeight || document.body.clientHeight; window.onresize = function() { //软键盘弹起与隐藏 都会引起窗口的高度发生变化 var resiz

Android之监听手机软键盘弹起与关闭

背景: 在很多App开发过程中需要在Activity中监听Android设备的软键盘弹起与关闭,但是Android似乎没有提供相关的的监听API给我们来调用,本文提供了一个可行的办法来监听软键盘的弹起与关闭. 预备知识: 在manifest文件中可以设置Activity的android:windowSoftInputMode属性,这个属性值常见的设置如下: android:windowSoftInputMode="stateAlwaysHidden|adjustPan" 那么这里值的含

flex布局,input点击软键盘激活,底部按钮上移

安卓手机的问题,原本表单没有超出一屏的时候,上移的现象也是存才的,只是需要滑动body才能看得到,现在,超出一屏了,现象就很明显了 body明显上移: 点击input修改价格: 软键盘出现: 先尝试了这样的方法: http://blog.csdn.net/u010394015/article/details/72781377 给底部按钮position:relative 中间内容,其中是有滚动条,flex布局,container{height:100%;} 衍生: 点击input被键盘挡住 测试

Android软键盘弹出将底部栏顶上去并不会挤压界面

界面需要,找到了一种不需要去设置android:windowSoftInputMode属性的解决keyboard和layout不适问题 有关设置android:windowSoftInputMode的资料,可自行百度. 我的方法就是,将xml文件的根布局设置成ScrollView,将之前的布局嵌套在里面就行了,不需要去设置以上的任何属性 在中间没有控件显示的地方,使用view设置weight去占位置 下面给出我的xml布局 <ScrollView xmlns:android="http:/

解决微信H5页面软键盘弹起后页面下方留白的问题(iOS端)

前言:微信H5项目,ios端出现了软键盘输完隐藏后页面不会回弹,下方会有一大块留白 最近微信和ios都有版本升级,不知道是哪边升级造成的,但是经过测试,软键盘收起后,再滚动一下页面,下面的留白就会消失.所以只要在输入完毕后模拟一下这个"滚动"的操作,就能解决问题了. 如果是用vue写的: <input type="text" @blur="fixScroll" placeholder="请输入xxx"/> //me

微信H5--手机键盘弹起导致页面变形

2017-3-22 今天工作中遇到了手机键盘弹出将整个界面都挤扁现象. 业务场景:点击input(type=text)输入验证码整个页面被挤扁. 解决办法:在input获取/失去光标时动态改变页面的高度, '你要解决页面的'.css.style.height = '你屏幕的高度' +'px'

输入框单独被软键盘弹起的解决方案

1.重新开一个Activity 重新开一个透明的activity<style name="TransparentTheme" parent="AppBaseTheme"> <!-- All customizations that are NOT specific to a particular API-level can go here. --> <item name="android:windowNoTitle"&

移动端弹出软键盘导致input光标和点击事件错位问题

我遇到的问题:在微信浏览器里,点击蒙层的input框,弹出软键盘,蒙层被顶上去,同时input的焦点和button的点击事件也被顶上去了,软键盘消失,蒙层回到原位,但是点击input和button均没反应,点击蒙层被顶上去的位置有反应,因为input的焦点和button的点击事件没回到原位.这个问题出现在ios中,android手机没问题. 以下是一位大佬写的解决方法,解决了我的问题. 原文地址:https://blog.csdn.net/Doubleu_/article/details/865