ionic overflow:auto失效
事情的起因是 同事上传一个很宽的table文件,因为手机屏幕宽度有限,因此要求 用户可以水平滚动页面,这样table的内容通过滚动就可以实现啦。
当时感觉很简单 给table外面的容器加个overflow:auto;就可以了呗;
然而,,,安卓是没问题的,ios却不行,死活滚动不了。
于是想到用ionic中的滚动来实现,ion-scroll;
<ion-scroll zooming="true" direction="x">
<pre class="doc" ng-bind-html="displayDocHtmlData"></pre>
</ion-scroll>
这次在安卓和苹果上都可以水平滚动了。。。
但是,因为是从后台读取的数据,所以,有的内容是很长的,这个时候安卓依然没问题,ios却又死活上下滚动不了。。。
于是网上百度搜索,发现新的方法,不知道原理,,问题反正是解决了,不可思议。。。
<ion-view hide-back-button="true" cache-view="false" hide-nav-bar="true">
<ion-header-bar cache-view="false" class="bar-positive header-bar">
<button class="button button-clear return-btn" ng-click="goBack()">
</button>
<h1 class="title title-center">文档查看</h1>
</ion-header-bar>
<ion-content ng-init="init()" class="bg-color" overflow-scroll="true">
<ion-scroll zooming="true" direction="xy" style="height:100%;">
<pre class="doc" ng-bind-html="displayDocHtmlData"></pre>
</ion-scroll>
</ion-content>
</ion-view>
在ion-content中加 overflow-scroll="true"
ion-scroll中加入direction="xy" style="height:100%;"
有时间再研究下啦。
ionic overflow:auto失效的更多相关文章
- IE6,IE7上设置body{overflow:hidden;}失效Bug
IE6,IE7下设置body{overflow:hidden;}失效Bug 最近做项目发现在IE7下设置body{overflow:hidden;}后还是会出现纵向滚动条,所以上网查查了,在这里记录一 ...
- 解决IE6,IE7下子元素使用position:relative、父元素使用overflow:auto后,子元素不随着滚动条滚动的问题
解决IE6,IE7下子元素使用position:relative.父元素使用overflow:auto后,子元素不随着滚动条滚动的问题 在IE6,IE7下,子元素使用position:relati ...
- 在ie7中overflow:hidden失效问题及解决方案
css兼容ie7: 做页面的时候用负边距居中的时候在IE7下面,父节点中的overflow:hiden失效的问题,查阅了一些资料,总结一下解决方法. 问题原因: 当父元素的直接子元素或者下级子元素的样 ...
- 小tip:CSS vw让overflow:auto页面滚动条出现时不跳动
原文地址:http://www.zhangxinxu.com/wordpress/?p=4552 一.水平居中布局与滚动条跳动的千年难题 当前web届,绝大多数的页面间布局都是水平居中布局,主体定个宽 ...
- IE9父容器overflow:auto时,子容器状态更改导致滚动条下出现额外空间的问题探讨
IE的每次跟新都会有一些奇葩的bug,我们默默承受了. 这个问题在项目中出现困扰了我近一个星期,这里记录一下.看下面实例 <style> .panel{ width: 200px; ove ...
- 小tip:纯CSS让overflow:auto页面滚动条出现时不跳动
本文转载于张鑫旭博客,原文地址:http://www.zhangxinxu.com/wordpress/?p=4552 一.水平居中布局与滚动条跳动的千年难题 当前web届,绝大多数的页面间布局都是水 ...
- 定位absolute使内联支持宽高(块属性变为内联,内容默认撑开)margin auto 失效
relative 没脱离文档流 absdute 完全脱离文档流 margin :auto 失效 相对整个文档偏离 相对父级定位 fixed 脱离文档流 与绝对定位特性一致 3.P标快不能包块级标签 ...
- overflow:auto/hidden的应用
一.自适应两栏布局 <!DOCTYPE html><html lang="zh-CN"><head> <meta charset=&quo ...
- css ie7中overflow:hidden失效问题及解决方法
css兼容ie7: 做页面的时候用负边距居中的时候在IE7下面,父节点中的overflow:hiden失效的问题,查阅了一些资料,总结一下解决方法. 问题原因: 当父元素的直接子元素或者下级子元素的样 ...
随机推荐
- bzoj 1162 network
树上的区间第k小数,以前写的主席树是一直MLE的,后来看到一种在初始化的时候的优化:直接DFS这颗树,得到每个点的主席树,然后更新的时候另外对DFS序建主席树,答案加上初始每个点的主席树,这样在初始化 ...
- 忘记mysql root密码的解决方法
一. MySQL密码的恢复方法一 有可能你的系统没有 safe_mysqld 程序(比如我现在用的 ubuntu操作系统, apt-get安装的mysql) , 下面方法可以恢复 1. 停止mysql ...
- request_irq() | 注册中断服务函数【转】
本文转载自:http://blog.csdn.net/wealoong/article/details/7566546#t0 参考 : ARM Linux 中断机制分析.pdf linux-2.6. ...
- 一个section刷新 一个cell刷新
一个section刷新 一个cell刷新 //一个section刷新 NSIndexSet *indexSet=[[NSIndexSet alloc]initWithIndex:2]; [tabl ...
- 在VS中添加lib库的三种方法
注意: 1.每种方法也要复制相应的DLL文件到相应目录,或者设定DLL目录的位置,具体方法为:"Properties" -> "Configuration Prop ...
- http协议梳理(个人学习用)
HTTP默认的端口号为80,HTTPS的端口号为443. 在Internet中所有的传输都是通过TCP/IP进行的.HTTP协议作为TCP/IP模型中应用层的协议.HTTP协议通常承载于TCP协议之上 ...
- 升级python到2.7版本pip不可用
升级python到2.7版本pip不可用 [root@localhost pip-7.1.2]# pip Traceback (most recent call last): File "/ ...
- readline,readlines,read函数
readline是读取每一行,包括'\n'.读出来是一个含'\n'的字符串. realines是读取整个文件,返回所有行的一个list(写代码的时候你需要一个文件的某几行,就可以用这个函数去切分) r ...
- Storm入门2-单词计数案例学习
[本篇文章主要是通过一个单词计数的案例学习,来加深对storm的基本概念的理解以及基本的开发流程和如何提交并运行一个拓扑] 单词计数拓扑WordCountTopology实现的基本功能就是不停地读入 ...
- Java8的伪共享和缓存行填充--@Contended注释
在我的前一篇文章<伪共享和缓存行填充,从Java 6, Java 7 到Java 8>中, 我们演示了在Java 8中,可以采用@Contended在类级别上的注释,来进行缓存行填充.这样 ...