dom内容区域的滚动overflow,scroll
去掉手机上点击点中的默认高亮效果
-webkit-tap-highlight-color: rgba(0,0,0,0);
ios手动启动一下监听touch事件以响应css伪类:
document.addEventListener("touchstart", function(){}, true)
传统 pc 端中,子容器高度超出父容器高度,通常使用 overflow:auto 可出现滚动条拖动显示溢出的内容
1. 弹性滚动 android3+与ios5+版本增加了一个新的属性:overflow-scrolling
这个弹性滚动感觉起来像原生应用,因为这个本来就是原生的滚动。你只需要向可滚动区域增加一行代码。
隐藏的问题,由于使用硬件渲染,这个在手机端safarai会导致z轴偏高于static,但不会高于相应z-index设置的元素.
参考:https://developer.mozilla.org/en-US/docs/Web/CSS/-webkit-overflow-scrolling
//-webkit-overflow-scrolling: touch;
.container{
...
overflow:auto;/* winphone8和android4+ */
-webkit-overflow-scrolling: touch;
}
<div class="wrapper">
<div class="container">
<div class="item">....</div>
<div class="item">....</div>
<div class="item">....</div>
<div class="item">....</div>
<div class="item">....</div>
</div>
</div>
2.使用iscroll
参考http://www.cnblogs.com/PeunZhang/p/3553020.html
dom内容区域的滚动overflow,scroll的更多相关文章
- 通过overflow: scroll;来实现部分区域的滚动
在移动端中,我们希望元素的滚动,可以通过一些插件的使用来实现滚动,当然也可以自己来实现. 比如:对于某一个区域,我们可以限制好高度之后,设定:overflow-y: scroll; 这样,就可以实现滚 ...
- CSS中overflow:scroll怎么设置只上下滚动而不左右滚动
CSS中"overflow:scroll"默认是左右,上下都滚动.怎么设置只上下滚动而不左右滚动,下面有个不错的解决方法 CSS中"overflow:scroll&quo ...
- iOS菜单滚动联动内容区域功能实现
平时开发APP中关于此功能还是比较经常碰到,本实例借用三个开源的插件,并对其中一个进行修改调整实现出想要的效果:本文重点介绍修改的内容跟三个插件的运用,这三个插件还可以各自扩展到其它项目的运用: 效果 ...
- iScroll框架解析——Android 设备页面内 div(容器,非页面)overflow:scroll; 失效解决(转)
移动平台的活,兼容问题超多,今儿又遇到一个.客户要求在弹出层容器内显示内容,但内容条数过多,容器显示滚动条.按说是So easy,容器设死宽.高,CSS加属性 overflow:scroll; -we ...
- 超详细Vue实现导航栏绑定内容锚点+滚动动画+vue-router(hash模式可用)
超详细Vue实现导航栏绑定内容锚点+滚动动画+vue-router(hash模式可用) 转载自:https://www.jianshu.com/p/2ad8c8b5bf75 亲测有效~ <tem ...
- [转] 设置div的overflow:scroll,但是在手机上滑动的时候有点卡顿
设置div的overflow:scroll,但是在手机上滑动的时候有点卡顿,所以在这个div上加一个css: -webkit-overflow-scrolling : touch; 在苹果手机上使用- ...
- overflow:scroll 滚动条不显示
overflow:scroll 滚动条不显示 ::-webkit-scrollbar-thumb 可能因为 自定义的滚动条height比元素可展示内容大
- 滚动锁定 scroll lock 键有什么用?
滚动锁定 scroll lock 键有什么用? 中文名称:滚动锁定键 按下此键后在Excel等按上.下键滚动时,会锁定光标而滚动页面:如果放开此键,则按上.下键时会滚动光标而不滚动页面. ...
- 解决页面使用overflow: scroll,overflow-y:hidden在iOS上滑动卡顿的问题
解决页面使用overflow: scroll,overflow-y:hidden在iOS上滑动卡顿的问题 div{ width: 100%; overflow-y: hidden; -webkit-o ...
随机推荐
- nuxt.config有关router配置
这里只说明一个属性,其他属性移步官方文档 https://zh.nuxtjs.org/api/configuration-router extendRoutes 官方说明: 你可以通过 exten ...
- [CQOI2007]余数求和 (分块+数学
题目描述 给出正整数n和k,计算G(n, k)=k mod 1 + k mod 2 + k mod 3 + … + k mod n的值,其中k mod i表示k除以i的余数.例如G(10, 5)=5 ...
- python——获取数据类型
在python中,可使用type()和isinstance()内置函数获取数据类型 如: (1)type()的使用方法: >>> a = '230' >> ...
- 笔记-爬虫-XPATH
笔记-爬虫-XPATH 1. xpath XPath是W3C的一个标准.它最主要的目的是为了在XML1.0或XML1.1文档节点树中定位节点所设计.目前有XPath1.0和XPath2.0两 ...
- Echarts 解决饼图文字过长重叠的问题
之前在网上查找了很多关于解决饼图文字描述过长导致重叠的问题,找了很多一直没有一个合适的解决方案,最后自己只能花时间研究echarts文档,功夫不负有心人,终于解决了文字重叠展示不全等问题. 废话不多说 ...
- getElementByName????????,????????,
getElementByName可以获取多个元素,获得的是一个数组, getElementById只能获取一个,是dom从上往下的第一个元素.
- 栈和队列&前缀,中缀,后缀
1.堆和栈的区别? (1)栈内存操作系统来分配,堆内存由程序员自己来分配. (2)栈有系统自动分配,只要栈 剩余空间大于所申请空间,系统将为程序提供内存,否则将报异常提示栈溢出. 2.栈(线性表) 仅 ...
- cookie不能删除
cookie不仅仅包含一个键值对,还包含域 domain 路径path, 一般domain是请求的地址 www.baidu.com/news.html 那domain就是www.baidu.com ...
- ansible自动安装rabbitmq
ansible playbook 安装rabbitmq单机版,以下脚本在CentOS6.7服务器测试通过. 需要配置本机的yum源,用于安装socat软件. rabbitmq版本和Erlang版本需要 ...
- [转载]unity优化1
官方优化文档--优化图像性能http://docs.unity3d.com/Documentation/Manual/OptimizingGraphicsPerformance.html Unity3 ...