ion-content形成上下结构，上面固定，下层可滑动

首先要设置ion-content不可滑动：<ion-content class="has-subheader" scroll="false"></ion-content>

其次在ion-content中，使用ion-scroll，并加上css:<ion-scroll direction="y" style="position: absolute; top:110px; bottom: 0; left: 0; right: 0;"></ion-scroll>

这样就可以实现滑动时ion-content里边的内容形成上下结构，不在ion-scroll标签里边的内容固定不动，ion-scroll里边的内容可以滚动，且不会遮挡上方元素。

ion-scroll水平滑动时在Android中无效

解决办法：在ion－scroll标签里加上overflow-scroll="false"；

ionic中的ion-content与ion-scroll的更多相关文章

  1. ionic中获取坐标方法

    ionic中获取坐标的方法 1.首相需要执行命令: cordova plugin add cordova-plugin-geolocation2.然后块级注入配置bower文件引入ngCordova ...

  2. ionic中的生命周期函数

    //ionic中的生命周期函数 onPageLoaded(){ //page初始化时 console.log("page 1 : page loaded"); } //在这里可以做 ...

  3. Ionic中弹窗

    Ionic中弹窗有两种ionicModal和ionicPopup; $ionicModal是完整的页面: $ionicPopup是(Dialog)对话框样式的,直接用JavaScript设定对话框的一 ...

  4. javascript中常用坐标属性offset、scroll、client

    原文:javascript中常用坐标属性offset.scroll.client 今天在学习js的时候觉得这个问题比较容易搞混,所以自己画了一个简单的图,并且用js控制台里面输出测试了下,便于理解. ...

  5. ZH奶酪：Ionic中（弹出式窗口）的$ionicModal使用方法

    Ionic中[弹出式窗口]有两种(如下图所示),$ionicModal和$ionicPopup; $ionicModal是完整的页面: $ionicPopup是(Dialog)对话框样式的,直接用Ja ...

  6. ionic中android的返回键

    ionic中android的返回键 在ionic框架中已经注册了几个返回事件,分别是 view sideMenu modal actionSheet popup loading 他们的优先级分别是 v ...

  7. Ionic 中badge的应用

    app中如果有服务端推送过来的消息,用户没有查看的话,出现一个数字提醒,类似微信的那种效果. 在Ionic中的实现过程还是很简单的: <ion-tab title="首页" ...

  8. 解决 ionic 中的 CORS（跨域）

    译者注:本人翻译功力有限,所以文中难免有翻译不准确的地方,凑合看吧,牛逼的话你看英文版的去,完事儿欢迎回来指正交流(^_^) 如果你通过 ionic serve 或者 ionic run 命令使用或 ...

  9. 电子商务(电销)平台中内容模块(Content)数据库设计明细

    以下是自己在电子商务系统设计中的数据库设计经验总结,而今发表出来一起分享,如有不当,欢迎跟帖讨论~ 文章表 (article)|-- 自动编号|-- 文章标题 (title)|-- 文章类别编号 (c ...

  10. angular 图片加载失败 情况处理？ 如何在ionic中加载本地图片 ?

    1.angular 图片加载失败 情况处理 在directive中定义组件,在ng-src错误时,调用err-src app.directive('errSrc',function(){ return ...

随机推荐

  1. apt-get &dpkg

    apt-get是ubuntu常用的软件安装工具.他可以很easy的从互联网上下载软件安装包,并实现安装. apt-get比较常用的命令如下: apt-get install packagename   ...

  2. Http下的各种操作类.WebApi系列~通过HttpClient来调用Web Api接口

    1.WebApi系列~通过HttpClient来调用Web Api接口 http://www.cnblogs.com/lori/p/4045413.html HttpClient使用详解(java版本 ...

  3. 字符串左移n位操作

    void reverse(char* str, int begin, int end) { char temp; for( ; begin < end; begin++) { temp = st ...

  4. Gson 和 Fastjson 你不知道的事

    背景 目前在公司负责的业务, 主要是跟JSON数据打交道, fastjson .gson都用, 他们适用于不同场景.fastjson号称是业界处理json效率最高的框架, 没有之一.但在某些场景下, ...

  5. .NET常用类库--苏飞合集

    在线网站:http://tool.sufeinet.com/CodePreview/CodeView.aspx?action=view&file=Zip/SharpZip.cs C#基类库大全 ...

  6. 数据结构复习：希尔排序的C++实现

    1.原理介绍 希尔排序又称为缩小增量排序,由D.L.Shell在1959年提出而得名. 该算法先取一个小于数据表中元素个数 n 的整数gap, 并以此作为第一个间隔,将数据分为gap个子序列,所有距离 ...

  7. C++ 初始化与赋值

    1.初始化与赋值的区别: 二者的区别不是看,是否有=这个赋值操作符,而是看操作的时候,对象是否已经有值. 初始化:创建对象,并给它设置初始值. 赋值:对象已经有值,擦除对象的当前值,并使用新值代替. ...

  8. iOS 7 Pushing the Limits Notes - create a layer like notification center's or control center's background

    Problem: How to create a layer that looks like your notification center's or control center's backgr ...

  9. LFS7.4编译笔记（2）

    上一篇我们已经搭建好了临时系统,这一篇我们就开始正式构建我们的最终LFS系统. 首先切换到root,准备虚拟内核文件系统并挂载: su - export LFS=/mnt/lfs mkdir -pv ...

  10. 一天掌握Android JNI本地编程 快速入门

    一.JNI(Java Native Interface)        1.什么是JNI:               JNI(Java Native Interface):java本地开发接口   ...