手机端上的猫腻真是多啊~~~ 此起彼伏!

最近又遇到了 固定定位的底部导航在ios上被弹出去

此时内心1w+个草泥马奔过~~~~~~~~

直接上解决方案:

<div class="main_comment">```````````````````</div>
<div class="commentBar">回复框</div>
.main_comment{
width: 100%;
position: absolute;
overflow-y: auto;
top: 0;
bottom: 0;
-webkit-overflow-scrolling: touch; /*这句是为了滑动更顺畅*/
}
.commentBar{
width: 100%;
position: absolute;
bottom: 0;
left: 0;
background: #fff;
padding: 5px;
z-index: 99;
}

 

这里都是用了absolute去解决,达到理想中的效果。

在ios上表现顺畅,在安卓上略显卡顿。不知道是否还有更好的解决办法~

 

  

ios上position:fixed失效问题的更多相关文章

  1. 偏前端 - ios下position:fixed失效的问题解决

    如图,考虑到用户体验的问题,一般页面的下方提交按钮都会随着固定在页面上,方便用户点击. 有些人肯定就说了,这还不简单,position:fixed: 但是在ios这个坑货系统上这个position:f ...

  2. IOS中position:fixed吸底时的滑动出现抖动的解决方案

    H5方法: //吸顶头部 .header{ width:100%; height:50px; position:fixed; top:0px; } //main滑动区域 .main{ width:10 ...

  3. 当锚点定位遇上position: fixed

    <!DOCTYPE html><html> <head> <title>当锚点定位遇上position: fixed</title> < ...

  4. position:fixed 失效

    如果position:fixed 失效,那应该是你设置position的元素的父元素中有设置了transform属性哦 . 把 transform删除或设置为none就可以解决啦. 但是如果trans ...

  5. ios解决输入框弹出后position:fixed失效问题

    最近在使用AmazeUI进行仿App Mobile Web开发时遇到了讨论众多的position:fixed问题.position:fixed在安卓2.2以上已经实现,但是在ios8以下系统当小键盘激 ...

  6. position:fixed失效

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  7. position:fixed失效情况

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  8. position:fixed 失效问题

    为了提升动画性能,在body上加上了transform:translate3d(0,0,0) 但是3d使得新建了一个层(具体原因请参考:高性能css动画),导致position:fixed不在当前的层 ...

  9. IOS中position:fixed弹出框中的input出现光标错位的问题

    解决方案是 在弹框出现的时候给body添加fixed <style type="text/css"> body{ position: fixed; width: 100 ...

随机推荐

  1. Mysqle 常用 函数

    一.数学函数 数学函数主要用于处理数字,包括整型.浮点数等.             select   可以用作输出 ABS(x) 返回x的绝对值 SELECT ABS(-1) -- 返回1 CEIL ...

  2. FreeRTOS学习及移植笔记之一:开始FreeRTOS之旅

    1.必要的准备工作 工欲善其事,必先利其器,在开始学习和移植之前,相应的准备工作必不可少.所以在开始我们写要准备如下: 测试环境:我准备在STM32F103平台上移植和测试FreeRTOS系统 准备F ...

  3. iOS TabeView 头视图和尾视图不滑动的实现

    因项目有需求不能让section中的头尾视图滑动,顾根据网上的一些资料和自己整理的思路,已实现了不滑动效果,上代码,啥都说了,搞了2个小时都是泪.... 1.创建一个tableview _mainTa ...

  4. 【django】京东等大型网站的混合搜索是怎么实现的?

    混合搜索在各大网站如京东.淘宝都有应用,他们的原理都是什么呢?本博文将为你介绍它们的实现过程. 混合搜索的原理,用一句话来说就是:关键字id进行拼接. 混合搜索示例: 数据库设计: 视频方向: cla ...

  5. 8-07CONTIUE 、 BREAK、RETURN

    CONTIUE: 可以让程序跳过CONTIUE关键字之后的语句,回到WHILE循环的第一行命令. BREAK:让程序跳出循环,结束WHILE的循环. BREAK: 让系统完全跳出循环,结束WHILE循 ...

  6. java DMO及增删改查代码的自动生成

    在web开发过程中,尤其是后台管理系统的开发中,少不了增删改成的基础操作,原来我自己的做法是一份一份的拷贝粘贴,然后修改其中的不同,然而这样既枯燥无味又浪费了大量的时间,所以根据自己项目结构的特点写了 ...

  7. linux安装open block chain

    Compile the source code Step 1. 安装git sudo apt-get install git Step 2. 安装vagrant(ubuntu系统) 下载地址https ...

  8. tcp三次握手和四次握手

    建立TCP需要三次握手才能建立,而断开连接则需要四次握手.整个过程如下图所示: 先来看看如何建立连接的. 首先Client端发送连接请求报文,Server段接受连接后回复ACK报文,并为这次连接分配资 ...

  9. 第八章 springboot + mybatis + 多数据源

    http://www.cnblogs.com/java-zhao/p/5413845.html

  10. VR的世界里没有雾霾!暴风魔镜发布Matrix一体机

         在2016年接近尾声的时候,暴风魔镜给VR行业带来一波暖流.12月20日,暴风魔镜宣布推出最新VR一体机--暴风魔镜"3K屏概念机"MATrix及VR眼镜S1两大产品. ...