touch-action css属性 滚动和缩放手势
CSS 属性 touch-action 用于指定某个给定的区域是否允许用户操作,以及如何响应用户操作(比如浏览器自带的划动,缩放等)
默认情况下,平移(滚动) 和 缩放手势由浏览器专门处理。该属性用于取消浏览器默认手势行为,开发人员自定义滚动和手势行为。
touch-action的值:
auto : 当触控事件发送在元素上时,由浏览器来决定进行那些操作,比如viewport进行平滑 缩放。
none : 当触控事件发生在元素上时,不进行任何操作
pan-x : 启用单指水平平移手势
pan-y : 启用单指垂直平移手势。
manipulation : 只可以进行滚动和持续缩放操作。如双击缩放等别的手势
pinch-zoom : 启用多手指平移和缩放页面,这可以和任何平移值组合 如 touch-action:pan-x pan-y pinch-zoom;
最常见的用法时禁用元素(及其不可滚动的后代)上的所有手势,以使用自己提供的拖放和缩放的行为
touch-action:none;
还有一个用法是使用指针事件处理水平平移的图片轮播,但不想干扰页面的垂直滚动或缩放
touch-action:pan-y pinch-zoom;
解决双击缩放手势引起的点击事件延迟
touch-action:manipulation;
touch-action css属性 滚动和缩放手势的更多相关文章
- CSS 属性:touch-action
CSS 属性 touch-action 用于指定某个给定的区域是否允许用户操作,以及如何响应用户操作(比如浏览器自带的划动.缩放等). /* Keyword values */ touch-actio ...
- CSS属性一览
CSS 属性 CSS 属性组: 动画 背景 边框和轮廓 盒(框) 颜色 内容分页媒体 定位 可伸缩框 字体 生成内容 网格 超链接 行框 列表 外边距 Marquee 多列 内边距 分页媒体 定位 打 ...
- CSS属性定义 文本修饰 边框效果 背景修饰
一.CSS属性定义1.css颜色表示方法[重点]rgb(红绿蓝3个颜色通道 强度值为0-255)rgb(0,0,0)rgba(alpha a是透明度 值为0-1)rgba(123,123,123,0) ...
- 值得注意的CSS属性
文本TEXT letter-spacing 字符间距 word-spacing 字间距 line-height 行高 text-decoration 修饰(下划线) text-indent 首行缩进 ...
- Python web前端 03 CSS属性
Python web前端 03 CSS属性 一.文字.文本属性 1.文字属性 font-family #字体类型浏览器默认的字体是微软雅黑,字体中有多个字体的时候,如果前面的字体没有就使用后面的字体 ...
- 前端基础-CSS属性操作
前端基础-CSS属性操作 css text 文本颜色:color 颜色属性被用来设置文字的颜色. 颜色是通过CSS最经常的指定: 十六进制值 - 如: #FF0000 一个RGB值 - 如: RGB( ...
- css 属性相关
css属性相关 宽和高 width属性可以为元素设置宽度, height属性可以为元素设置好高度 块级标签才能设置宽度,内联标签的宽度由内容来决定. 字体属性 文字字体 font-family 可以把 ...
- 缩放手势 ScaleGestureDetector 源码解析,这一篇就够了
其实在我们日常的编程中,对于缩放手势的使用并不是很经常,这一手势主要是用在图片浏览方面,比如下方例子.但是(敲重点),作为 Android 入门的基础来说,学习 ScaleGestureDetecto ...
- css属性、样式、边框、选择器
CSS 层叠样式表 (Cascading Style Sheets,缩写为 CSS),是一种 样式表 语言, 用来描述 HTML或 XML(包括如 SVG.MathML.XHTML 之类的 XML 分 ...
随机推荐
- [Xcode 实际操作]九、实用进阶-(30)为IAP(支付方式)内购项目添加测试账号,测试内购功能
目录:[Swift]Xcode实际操作 本文将演示如何添加测试账号,以方便对内购功能进行测试. IAP,即in-App Purchase ,是一种智能移动终端应用程序付费的模式, 在苹果(Apple) ...
- AutoLayout 根据文字、图片自动计算 UITableViewCell 高度
原文网址: http://lvwenhan.com/ios/449.html 此系列文章代码仓库在 https://github.com/johnlui/AutoLayout ,有不明白的地方可以参考 ...
- JQuery:介绍、安装、选择器、属性操作、动画
目录 jQuery 详细内容 1.JQuery介绍 2.JQuery的下载安装 3.JQuery的使用 4.jQuery的选择器 5.JQuery的属性操作 6.动画 6.自定义动画 jQuery 详 ...
- MyBais中xxMap.xml中的知识点
添加新的mapper的时候下面两个标红的地方要注意,如果统一约定好命名的话都还好,但是就怕一会这样一会那样的业务代码:总之小心! <!-- spring与mybatis整合配置,扫描所有dao, ...
- 嵌入式C语言模块编写
C 语言源文件 *.c 理想的模块化应该可以看成是一个黑盒子.即我们只关心模块提供的功能,而不管模块内部的实现细节.在大规模程序开发中,一个程序由很多个模块组成,这些模块的编写任务被分配到不同的人,编 ...
- dp专题复习
背包: 1.bzoj2287:[POJ Challenge]消失之物 2.bzoj2748:[HAOI2012]音量调节 3.bzoj2794:[Poi2012]Cloakroom 4.bzoj119 ...
- python使用C扩展
CPython还为开发者实现了一个有趣的特性,使用Python可以轻松调用C代码 开发者有三种方法可以在自己的Python代码中来调用C编写的函数-ctypes,SWIG,Python/C API.每 ...
- [已读]CSS禅意花园
蛮早的一本书,提到了一些小tip,比如负margin实现居中.FIR图像替换.
- java.lang.IllegalArgumentException: Illegal character in query at index ...解决办法
今天在写智能机器人问答实现的时候遇到了一个问题,就是我发送消息不能输入空格 给我报了一个错误java.lang.IllegalArgumentException: Illegal character ...
- spring security 5 There is no PasswordEncoder mapped for the id "null" 错误
转载请注明出处 http://www.cnblogs.com/majianming/p/7923604.html 最近在学习spring security,但是在设置客户端密码时,一直出现了一下错误提 ...