首页 > 代码库 > 移动端虚拟键盘影响页面布局的问题

移动端虚拟键盘影响页面布局的问题

问题描述:点击input输入框,虚拟键盘弹出时,若body禁止滚动,在一个页面显示时,body中元素会被压缩变形。若body出现滚动条,则会将整体页面向上移动

解决方法:

1、

$(document).ready(function() {  
   $(‘body‘).height($(‘body‘)[0].clientHeight);
});

2、$(‘input‘).focus(function(){ $(‘.contact‘).css(‘position‘,‘static‘); }).blur(function(){ $(‘.contact‘).css(‘position‘,‘fixed‘); });

 

移动端虚拟键盘影响页面布局的问题