在单页面情况下,安卓平台下会产生input标签遮挡的问题,这里提供一种解决方案,最后的效果是类似ios一样把整个页面网上移,使用户可以通过拖动来浏览网页,当收起键盘,页面恢复原状。
css部分:
body{
width:100%;
height:100%;
overflow:scroll;
}
.container{
width: 100%;
height: (这里随意,需要用js设定);
position: absolute;
top: 0;
}
js部分:
var winHeight = document.documentElement.clientHeight;
$('.container').css('height',winHeight+'px');
alert(winHeight+'-'+$('body').height())
不能直接设置container高度为100%,因为当键盘出现时,他的高度会跟随body的高度被键盘压缩,当用js设定container的高度后,body被压缩时,container的高度会溢出body,从而产生可以拖动的效果
网友评论