HTML 在安卓手机端软键盘弹出顶起页面布局的解决办法

 $(‘body‘).height($(‘body‘)[0].clientHeight);

以上是背景即BODY被顶起的解决办法。

如果是footer被顶起,则可以用判断解决,

$(‘input‘).focus(function(){
        $(‘.share‘).css(‘display‘,‘none‘);
    })
    $(‘input‘).blur(function(){
        $(‘.share‘).css(‘display‘,‘block‘);
    })
时间: 2024-10-05 02:27:54

HTML 在安卓手机端软键盘弹出顶起页面布局的解决办法的相关文章

移动端 软键盘 弹出时 影响布局

移动端 软键盘 弹出时 会影响布局 1)前段时间作的移动端页面,因为高度只有1页所以用了height:100%;width:100%; ios下点击输入框弹出软键盘时,布局没有大影响. 当输入框可能被软键盘压到时,在一部分安卓下却出了问题,华为自带浏览器和UC会有布局上的问题. 原因可能是因为,软键盘弹出时,改变了height,使height:100%,不能达到原来的高度. 解决办法: $(document).ready(function () { $('body').height($('bod

Android软键盘弹出时把布局顶上去的解决方法

原文: 解决Andriod软键盘出现把原来的布局给顶上去的方法(转) 链接:http://blog.sina.com.cn/s/blog_9564cb6e0101g2eb.html 决方法,在mainfest.xml中,对那个Activity加: <activityandroid:name=".activity.HomeActivity"android:windowSoftInputMode="adjustPan|stateHidden"></ac

H5页面关于android软键盘弹出顶起底部元素的解决方案

通过resize方法监听$(this).height(),获取页面高度,成功获得改变后的页面高度,软键盘弹出时隐藏被顶起的页面. var winHeight = $(window).height(); //获取当前页面高度 $(window).resize(function(){ var thisHeight=$(this).height(); if(winHeight - thisHeight >50){ //当软键盘弹出,在这里操作 $(".顶起的页面").hide(); }

安卓移动端软键盘弹出问题解决方案

移动端开发难免拿到输入框居中或者位于底部的情况,ios 端,软键盘能够按正常预期向上滑动(这里有个问题,当 input 聚焦时,弹出软键盘,input 上滑,此时屏幕是具有滚动效果的,还没找到合适的解决方案),Android 端,并不会滑动,通常做法是设置 window.scrollTo(0, virtualKeyboard.Height), 但是如果你的 input 所在的 div 是绝对定位的话,window.scrollTo 这个事件是监听不到的,这里给出另一套解决方案 self.refs

解决安卓手机上软键盘弹出挤压背景的问题

demo: // 解决本页面软键盘弹窗背景挤压的问题 var clientHeight = document.documentElement.clientHeight || document.body.clientHeight; $(window).on('resize', function () { var nowClientHeight = document.documentElement.clientHeight || document.body.clientHeight; if (cli

Android软键盘弹出不影响布局的方法

The AndroidManifest.xml File android:windowSoftInputMode=["stateUnspecified", "stateUnchanged", "stateHidden", "stateAlwaysHidden", "stateVisible", "stateAlwaysVisible", "adjustUnspecified&q

web页面移动端键盘弹出后对页面布局的影响

1.由于弹出键盘后屏幕的高度会发生改变,所以页面的绝对/固定定位布局会受到影响 2.键盘弹出后输入框被遮挡掉了,需要设置定时器在输入框聚焦200ms后调用红框区域的标签的scrollIntoView(true)和scrollIntoViewIfNeeded()使输入框显示在可视区域内               3.键盘弹出后页面发生滚动,若不想然页面滚动可设置定时器在输入框聚焦200ms后把页面的滚动位置重置为0px 原文地址:https://www.cnblogs.com/chenxiang

周记3——解决fixed属性在ios软键盘弹出后失效的bug

这周在做空间("类似"qq空间)项目.首页是好友发表的说说,可以针对每条说说进行评论,评论框吸附固定在屏幕底部.此时,Bug来了...在ios上,软键盘弹出后fixed属性失效了.后来发现,ios绝大部分情况把fixed变成了absolute.为什么说是绝大部分情况下而不是100%,后面会提到.下面介绍2种方案... 1.css布局 (推荐) 解决思路:既然在 iOS 下由于软键盘唤出后,页面 fixed 元素会失效,导致跟随页面一起滚动,那么假如--页面不会过长出现滚动,那么即便 f

如何解决软键盘弹出引起的各种不适

1.如何解决软键盘弹出引起的各种不适 2.android软键盘弹出引起的各种不适终极解决方案 3.android软键盘弹出引起的各种不适终极解决方案 4.android软键盘弹出,会把原来的界面挤上去的问题 处理方法 5.Android 关于弹出键盘问题的几种情况和解决方案 6.Android 弹出软键盘问题(最终解决方法) 7.Android 软键盘显示隐藏监听解决方案