扫码关注官方订阅号
之前用了 iscrool.js 来解决这个问题,但是我突然又觉得单为了这么个问题而专门引用个框架,有点“大动干戈”,不知各位有什么好方法?
人生最曼妙的风景,竟是内心的淡定与从容!
楼主可以参考这篇博客:Web移动端Fixed布局的解决方案
其他的我还太清楚,我自己一般是这样处理的:通过absolute代替fixed。如果还有软键盘遮盖掉了输入框,那么可以用一下下面的这个方法。输入框获取焦点后,手动的调整滚动条的位置。参考代码如下(我用到了zepto/jquery):
<input type="text" data-make="doScroll" class="insertInput" placeholder="请输地址"> $("input").focus(function(){ //获取值 var makeDo = $(this).attr("data-make"); //事件适配器 var doSomething = { "doScroll":changeInputScroll }; if ( makeDo && doSomething.hasOwnProperty(makeDo) ) { doSomething[makeDo]($(this),$("#mainCon")); } }); //获取焦点的时候,动态的改变滚动条的位置 function changeInputScroll($input,$con){ var viewTop = $con[0].scrollTop,//当前的滚动条高度 viewBottom = viewTop + $con[0].innerHeight,//当前容器的高度 viewShowTop = $con.offset().top;//当前视口的位置 var elementTop = $input.offset().top, //当前对象,在页面中的位置 elementBottom = elementTop + $input.height() - viewShowTop;//要移动的距离 //设置滚动条位置 $con.scrollTop(elementBottom); }
微信扫码关注PHP中文网服务号
QQ扫码加入技术交流群
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
PHP学习
技术支持
返回顶部
楼主可以参考这篇博客:Web移动端Fixed布局的解决方案
其他的我还太清楚,我自己一般是这样处理的:通过absolute代替fixed。如果还有软键盘遮盖掉了输入框,那么可以用一下下面的这个方法。输入框获取焦点后,手动的调整滚动条的位置。参考代码如下(我用到了zepto/jquery):