我正在尝试应用这个:
body {
touch-action: none;
}
.left-side {
touch-action: pinch-zoom;
}
<div class="left-side"><img src="image.jpg" /></div>
触摸 Action :没有工作,但现在左侧是:(
我做错了什么?还是 body 压倒了一切?
最佳答案
touch-action
值 pinch-zoom
是一种修饰符。根据The MDN spec ,它与其他值结合使用:
The
touch-action
property may be specified as either:
- any one of the keywords
auto
,none
,manipulation
, or- one of the keywords
pan-x
,pan-left
,pan-right
, and/or one of the keywordspan-y
,pan-up
,pan-down
, plus optionally the keywordpinch-zoom
.
pinch-zoom
本身什么都不做,它只是让浏览器知道它应该允许使用两个手指手势;控制与其一起列出的操作。
所以如果你想让多指支持横向平移页面,你可以使用:
.left-side {
touch-action: pan-x pinch-zoom;
}
注意:请记住,此功能仅适用于触摸设备;鼠标和可访问系统不会反射(reflect)任何功能更改。
关于javascript - css touch-action none on body, pinch-zoom on element,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/52524373/