<div style="position: fixed"></div>

<div style="height: 100%; overflow: auto;"></div>

<div  style="position: fixed"></div>

主要思想是分为上、中、下三层,中间层为主要内容层,上下层是浮动的DIV,分别浮动在顶部和底部,也可根据自身需要修改position属性。

解决IOS滑动页面fixed浮动问题的更多相关文章

  1. 【前端开发】解决ios设备上fixed浮动的input输入框兼容问题

    我们在开发移动端页面时,经常会存在这种需求,在页面顶部或底部有一个输入框,一直浮动在顶部或底部位置,中间部分的内容是可以滚动的.比如底部输入框的搜索功能,或底部输入框的写评论功能. 这种问题,我们一般 ...

  2. 解决ios双击页面上移问题

    做webapp时,ios有个默认双击事件,会缩放页面,并将当前点击的位置居中到屏幕,本来也没什么,但是当页面中有fixed定位的元素时,这时候你就会神奇的发现,fixed元素所见不所得了! 还有就是页 ...

  3. 解决ios手机页面overflow scroll滑动很卡的问题

    在移动端html中经常出现横向/纵向滚动的效果,但是在iPhone中滚动速度很慢,感觉不流畅,有种卡卡的感觉,但是在安卓设备上没有这种感觉; 要解决这个问题很简单: 一行代码搞定 -webkit-ov ...

  4. 解决ios微信页面回退不刷新的问题

    在回退后需要刷新的页面加以下js $(function () {   var isPageHide = false;   window.addEventListener('pageshow', fun ...

  5. iOS 滑动页面标题切换颜色渐变效果

    话不多说,直接上图,要实现类似如下效果. 这个效果非常常见,这里着重讲讲核心功能 封装顶部的PageTitleView 封装构造函数 封装构造函数,让别人在创建对象时,就传入其实需要显示的内容 fra ...

  6. 移动端-解决ios连续点击页面上移问题

    引入js即可 //解决ios双击页面上移问题//在项目中测试不紧input/button这些表单控件有这个问题,p,div等也有问题,于是乎就直接在body开刀了(function(){ var ag ...

  7. 解决IOS微信浏览器底部会出现向前向后返回按钮,返回不刷新的问题

    <script type="text/javascript"> //解决IOS返回页面不刷新的问题 var isPageHide = false; window.add ...

  8. 解决IOS safari在input focus弹出输入法时不支持position fixed的问题

    该文章为转载 我们在做移动web应用的时候,常常习惯于使用position:fixed把一个input框作为提问或者搜索框固定在页面底部.但在IOS的safari和webview中,对position ...

  9. bootsrtap h5 移动版页面 在苹果手机ios滑动上下拉动滚动卡顿问题解决方法

    bootsrtap h5 移动版页面 在苹果手机ios滑动上下拉动滚动卡顿问题解决方法 bootsrtap框架做的h5页面,在android手机下没有卡顿问题,在苹果手机就一直存在这问题,开始毫无头绪 ...

随机推荐

  1. POJ 1655 Balancing Act (树形DP求树的重心)

    题意: 求一棵树中以某个点为重心最小的子树集, 就是去掉这个点, 图中节点最多的联通块节点最少. 分析: 想知道这个点是不是最优的点, 只要比较它子树的数量和除去这部分其他的数量(它的父节点那部分树) ...

  2. JSP指令学习

    JSP 指令 JSP指令用来设置整个JSP页面相关的属性,如网页的编码方式和脚本语言.语法格式: <%@ page attribute="value"%> 指令可以有很 ...

  3. js总结(二):函数、作用域和this

    function Container( properties ) { var objthis = this; for ( var i in properties ) { (function(){ // ...

  4. windows 下安装Apache httpd 只需三步

    1.下载 Apache 官网地址:http://httpd.apache.org/docs/current/platform/windows.html#down 找到这个, 看到这几个选项: Apac ...

  5. poj2186 求有向图G中所有点都能到达的点的数量

    /*题意:有向图,求这样的点的数量:所有点都能到达它.缩点成有向无环图,思:如果该强连通有出度,那么 从该出度出去的边必然回不来(已经缩点了),所以有出度的强连通必然不是.那么是不是所有出度为0的强连 ...

  6. ionic 之 基本布局

    目录: 简介 Hybrid vs. Others ionic CSS框架 基本布局 布局模式 定高条块:.bar .bar : 位置 .bar : 嵌入子元素 .bar : 嵌入input 内容:.c ...

  7. Spring Cloud(8):Sleuth和Zipkin的使用

    场景: 某大型电商网站基于微服务架构,服务模块有几十个. 某天,测试人员报告该网站响应速度过慢.排除了网络问题之后,发现很难进一步去排除故障. 那么:如何对微服务的链路进行监控呢? Sleuth: 一 ...

  8. ModelAndView对象作用

    ModelAndView ModelAndView对象有两个作用: 作用一  :设置转向地址,如下所示(这也是ModelAndView和ModelMap的主要区别) ModelAndView mv = ...

  9. java集合框架 hashMap 简单使用

    参考文章:http://blog.csdn.net/itm_hadf/article/details/7497462 通常,默认加载因子 (.75) 在时间和空间成本上寻求一种折衷.      加载因 ...

  10. 解决安装oracle11g r2时提示pdksh conflicts with ksh-20100621-2.el6.i686问题

    http://blog.csdn.net/linghao00/article/details/7943740 http://www.2cto.com/os/201306/218566.html 在Ce ...