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 ...
随机推荐
- 45.VUE学习之--组件之父组件使用scope定义子组件模板样式结构实例讲解
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- Poweroj:来自学长的善意:ZQ的杀龙之旅(状压BFS)
传送门:https://www.oj.swust.edu.cn/problem/show/2794 来自学长的善意:ZQ的杀龙之旅 Time Limit: 15000 MS Memory Limit: ...
- python基础之数据类型与变量patr2
一.元素分类 有如下值集合 [11,22,33,44,55,66,77,88,99,90...],将所有大于 66 的值保存至字典的第一个key中,将小于 66 的值保存至第二个key的值中. 即: ...
- SDK location not found. Define location with sdk.dir in the local.properties file or with an ANDROID
如题: SDK location not found. Define location with sdk.dir in the local.properties file or with an AND ...
- __bridge 使用注意
前奏 在平常开发中,我们可能遇到 CoreFoundation(CF) 框架的对象和 OC 对象之间的类型转换,这时候我们需要 __bridge 来帮忙 注意 : 如果是使用 CF __bridge ...
- php中utf-8转unicode
public function utf8_unicode($str) { $unicode = array(); $values = array(); $lookingFor = 1; for ($i ...
- 使用java去对比2个带数学公式的字符串
首先大家看到这个题目,可能会不屑一顾,呵呵,是的,起初我也认为这是个很简单的任务,当任务拿到手里后,经过我作为程序员来讲已经磨炼的无比通透的大脑来讲发现这其实是个坑. 故事的起因是这样的,想开发一款给 ...
- 5.修改haproxy配置文件
需求: 1.查 输入:www.oldboy.org 获取当前backend下的所有记录 2.新建 输入: arg = { 'backend': 'www.oldboy.org', 'record':{ ...
- 项目中DataTables分页插件的使用
在项目开发的过程中,一般都会对表格进行分页处理,大多是情况下会在项目中配置好后台分页插件,提高效率,减轻浏览器的压力.但是有时会遇到有些数据不能直接通过分页插件操作数据库进行分页数据查询,那就需要用到 ...
- 孤荷凌寒自学python第六十四天学习mongoDB的基本操作并进行简单封装3
孤荷凌寒自学python第六十四天学习mongoDB的基本操作并进行简单封装3 (完整学习过程屏幕记录视频地址在文末) 今天是学习mongoDB数据库的第十天. 今天继续学习mongoDB的简单操作, ...