在一个系统设计中,一般有些需要固定位置,便利操作。现在我要做一个上下两层,需要固定上方,下方拉刷新数据。

页面:

<ion-content scroll="false">
<div class="item item-divider" class="fixedTips">这是停车信息页面</div>
<ion-scroll direction="y" class="parkScroll">
<ion-list>
<ion-item>
hahhahaha
</ion-item>
<ion-item>
hahhahaha
</ion-item>
</ion-list>
</ion-scroll>
</ion-content>

css:

.fixedTips{
height:50px;
}
.parkScroll{
position: absolute;
top:50px!important;
bottom:0;
left:0;
right:0;
}

结果截图

Ionic开发-如何在ion-content形成上下结构 上面固定下层可滚动的更多相关文章

  1. Windows 下 Ionic 开发环境搭建

    Ionic 介绍 首先,Ionic 是什么. Ionic 是一款基于 Cordova 及 Angular 开发 Hybrid/Web APP 的前端框架,类似的其他框架有:Intel XDK等. 简单 ...

  2. Cordova/Ionic开发的Android APP启用Chrome Inspect调试的方法

    Cordova/Ionic开发的Android APP,需要启用WebView的调试模式,才可以在Chrome浏览器中输入chrome://Inspect,然后使用大家熟悉的开发者工具进行调试.不启用 ...

  3. 分享 Ionic 开发 Hybrid App 中遇到的问题以及后期发布 iOS/Android 的方方面面

    此篇文章主要整理了最近在使用 Ionic 开发 Hybrid App 过程中遇到的一些疑难点以及后期发布生成 iOS 和 Android 版本过程中的种种问题. 文章目录 Ionic 简介和项目需求介 ...

  4. Ionic开发实战

    转自:http://blog.csdn.net/i348018533/article/details/47258449/ 折磨的两个月!Ionic从零单排,到项目发布!遇到了很多问题但都一一解决了,此 ...

  5. Ionic 开发环境搭建

    android sdk环境搭建并非易事,本人经过无数失败,才使用以下方式成功 配置Ionic 开发环境 1.下载JDK并配置Java运行环境 http://www.oracle.com/technet ...

  6. [ionic开源项目教程] - 手把手教你使用移动跨平台开发框架Ionic开发一个新闻阅读APP

    前言 这是一个系列文章,从环境搭建开始讲解,包括网络数据请求,将持续更新到项目完结.实战开发中遇到的各种问题的解决方案,也都将毫无保留的分享给大家. 关注订阅号:TongeBlog ,查看移动端跨平台 ...

  7. 移动跨平台开发框架Ionic开发一个新闻阅读APP

    移动跨平台开发框架Ionic开发一个新闻阅读APP 前言 这是一个系列文章,从环境搭建开始讲解,包括网络数据请求,将持续更新到项目完结.实战开发中遇到的各种问题的解决方案,也都将毫无保留的分享给大家. ...

  8. Ionic开发笔记

    Ionic 开发笔记 记录开发中遇到的一些问题 ion-side-menu,使所有顶部导航标题居中 <!-- 添加 align-title="center" 使顶部导航标题居 ...

  9. ionic开发中,输入法键盘弹出遮挡住div元素

    采用ionic 开发中,遇到键盘弹出遮挡元素的问题. 以登陆页面为例,输入用户名和密码时,键盘遮挡了登陆按钮. 最终采用自定义指令解决了问题: .directive('popupKeyBoardSho ...

随机推荐

  1. poj 1821 Fence(单调队列优化DP)

    poj 1821 Fence \(solution:\) 这道题因为每一个粉刷的人都有一块"必刷的木板",所以可以预见我们的最终方案里的粉刷匠一定是按其必刷的木板的顺序排列的.这就 ...

  2. Android设备adb授权的原理【转】

    本文转载自:http://blog.csdn.net/zahuopuboss/article/details/50831171 http://blog.csdn.net/sowhat_ah/artic ...

  3. ad广告下拉收起代码

    1. [代码][JavaScript]代码<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" &qu ...

  4. 一步一步学Silverlight 2系列(20):如何在Silverlight中与HTML DOM交互(下)

    述 Silverlight 2 Beta 1版本发布了,无论从Runtime还是Tools都给我们带来了很多的惊喜,如支持框架语言Visual Basic, Visual C#, IronRuby, ...

  5. 安装程序工具 (Installutil.exe)

    网址:https://msdn.microsoft.com/zh-cn/library/50614e95(VS.80).aspx  安装程序工具 (Installutil.exe) .NET Fram ...

  6. 用 SDL2 处理精灵图

    上面就是一个精灵图,由多个固定间隔的图标组成.利用精灵图的好处就是不必将图标逐个读入内存进行操作.我们可以将精灵图中需要的部分用一个个矩形截取下来,然后再输出到渲染器上. 环境:SDL2 + VC++ ...

  7. BZOJ3895 rock

    题目:http://www.lydsy.com/JudgeOnline/problem.php?id=3895 看这题感觉好神. SG函数,dp....好像都不行呀. 最后去膜拜题解发现记忆化搜索 囧 ...

  8. B. Spider Man

    time limit per test 2 seconds memory limit per test 256 megabytes input standard input output standa ...

  9. 2.28 MapReduce在实际应用中常见的优化

    一.优化的点 Reduce Task Number Map Task输出压缩 Shuffle Phase 参数 map.reduce分配的虚拟CPU 二.Reduce Task Number Redu ...

  10. 2.27 MapReduce Shuffle过程如何在Job中进行设置

    一.shuffle过程 总的来说: *分区 partitioner *排序 sort *copy (用户无法干涉) 拷贝 *分组 group 可设置 *压缩 compress *combiner ma ...