overflow:scroll 在ios 滚动卡顿
使用
-webkit-overflow-scrolling
属性控制元素在移动设备上是否使用滚动回弹效果.
值
auto
使用普通滚动, 当手指从触摸屏上移开,滚动会立即停止。
touch
使用具有回弹效果的滚动, 当手指从触摸屏上移开,内容会继续保持一段时间的滚动效果。继续滚动的速度和持续的时间和滚动手势的强烈程度成正比。同时也会创建一个新的堆栈上下文。
非标准
该特性是非标准的,请尽量不要在生产环境中使用它!
尚未有相关规范。另在Apple提供的Safari CSS 参考文档中有所提及。
只在ios上有用
实际上,Safari真的用了原生控件来实现,对于有-webkit-overflow-scrolling的网页,会创建一个UIScrollView,提供子layer给渲染模块使用。
摘抄:
- 从SVN log看,在WebKit 108400版本左右才支持,所以iOS Safari应该是需要5.0。Android则是在4.0以上支持。
- 从前端开发的角度讲,只需要知道CSS的属性-webkit-overflow-scrolling是真的创建了带有硬件加速的系统级控件,所以效率很高。
- 从实际开发的角度讲,采用这样的做法相对是耗更多内存的,最好是在产生了非常大面积的overflow时才应用。
overflow:scroll 在ios 滚动卡顿的更多相关文章
- 解决scroll在ios上卡顿问题和兼容ios不支持:active伪类情况
//有时候因为滚动层级元素过多会产生卡顿,特别在ios上十分明显,如果不想更换其他实现方式,可以加:-webkit-overflow-scrolling: touch; 开启硬件加速: 兼容ios不支 ...
- bootsrtap h5 移动版页面 在苹果手机ios滑动上下拉动滚动卡顿问题解决方法
bootsrtap h5 移动版页面 在苹果手机ios滑动上下拉动滚动卡顿问题解决方法 bootsrtap框架做的h5页面,在android手机下没有卡顿问题,在苹果手机就一直存在这问题,开始毫无头绪 ...
- overflow属性及其在ios下卡顿问题解决
overflow属性:http://www.w3school.com.cn/cssref/pr_pos_overflow.asp overflow:scroll/auto;在手机页面滑动不流畅问题: ...
- 【转】iOS实时卡顿监控
转自http://www.tanhao.me/code/151113.html/ 在移动设备上开发软件,性能一直是我们最为关心的话题之一,我们作为程序员除了需要努力提高代码质量之外,及时发现和监控软件 ...
- iOS应用卡顿分析
1.屏幕显示图像的原理 显示器按照从上到下的方式,一行行扫描,扫描完成后显示器就呈现一帧画面,随后电子枪回到初始位置继续下一次扫描.为了把显示器的显示过程和系统的视频控制器进行同步,显示器(或者其他硬 ...
- css隐藏滚动条、移动端滚动卡顿的解决
1.如果想保持容器能够滚动,同时不想看到丑陋的滚动条,chrome.firefox和移动端上不考虑兼容性直接 element::-webkit-scrollbar{ display:none } 2. ...
- 解决微信小程序ios端滚动卡顿的问题
方案1:直接使用微信小程序提供的 “scroll-view " 组件. <scroll-view scroll-y style="height: 100%;"> ...
- 使用apicloud开发移动端APP,IOS list页面滚动卡顿解决记录
给内容容器添加样式:-webkit-overflow-scrolling:touch; -webkit-overflow-scrolling:属性控制元素在移动设备上是否使用滚动回弹效果. auto: ...
- overflow:scroll 在 iOS上滚动不流畅的问题
添加下面属性: -webkit-overflow-scrolling: touch;
随机推荐
- 【转载】SOCKS代理:从***到内网漫游
原文:SOCKS代理:从***到内网漫游 本文原创作者:tahf,本文属FreeBuf原创奖励计划,未经许可禁止转载 之前在Freebuf上学习过很多大牛写的关于Tunnel.SOCKS代理.***等 ...
- 使用Google Cloud Messaging (GCM),PHP 开发Android Push Notifications (安卓推送通知)
什么是GCM? Google Cloud Messaging (GCM) 是Google提供的一个服务,用来从服务端向安卓设备发送推送通知. GCM分为客户端和服务端开发. 这里我们只介绍服务端开发 ...
- 两个有序数组合并成一个有序数组(要求时间复杂度为O(n))
面试题: 怎样把两个有序数组合并成有序数组呢 逻辑步骤: 1.假设两个数组为A和B 2.A和B都是从小到大的顺序进行排列 ** 1.我们可以直接比较两个数组的首元素,哪个小就把这个小元素放入可变数组. ...
- 获取项目中.txt 文件的内容
package com.fh.controller.ruitai.util; import java.io.BufferedInputStream; import java.io.File; impo ...
- 原生js实现轮播图原理
轮播图的原理1.图片移动实现原理:利用浮动将所有所有照片依次排成一行,给这一长串图片添加一个父级的遮罩,每次只显示一张图,其余的都隐藏起来.对图片添加绝对定位,通过控制left属性,实现照片的移动. ...
- lintcode12 带最小值操作的栈
实现一个带有取最小值min方法的栈,min方法将返回当前栈中的最小值. 你实现的栈将支持push,pop 和 min 操作,所有操作要求都在O(1)时间内完成. 建一个栈helpStack,用来存放从 ...
- Click Once使用总结
做了一个CS结构软件,有十几个用户使用的客户端,因为刚开始试用期间,要不断根据用户使用情况修正问题和添加新功能,所以频繁更新是不可避免的,暂时没有深入去研究软件更新,暂时采取的方式是用户通过FTP自行 ...
- 手动在Windows上创建kafka环境
一 主要内容请移步 参考文章 二 一点小问题 安装上面的参考文章完成配置,并且尝试传输消息后,我尝试去查看kafka的消息数据,目录是{logdir}/test-0/00000000000000.lo ...
- cookie,localstorge,sessionstorge三者总结
相同点:都是客户端存储东西的: 不同: 1大小,cookie最小;locastorge最大 2 cookie设置好会在header头里面自动带的:但是ls和ss不会:ls同个浏览下不同网页(非跨域)都 ...
- 硬件电路中VCC,VDD,VEE,VSS有什么区别
电路中GND和GROUND.VCC,VDD,VEE,VSS有什么区别 一.解释 DCpower一般是指带实际电压的源,其他的都是标号(在有些仿真软件中默认的把标号和源相连的)VDD:电源电压(单极器件 ...