作者:cxsw01 | 来源:互联网 | 2023-01-18 20:27
我正在设计一个主要关注数据输入的网站.在我的一个表单中,我有一些按钮可以快速递增和递减表单字段中的数字值.我在用
禁用似乎使用适用于IOS的Firefox应用程序工作的缩放.但是,当另一个用户使用Safari对其进行测试时,单击该按钮的速度过快会导致页面放大,从而分散用户的注意力并使其无法快速增加值.从IOS 10开始,Apple出于可访问性原因删除了user-scalable = no,这就是为什么它只适用于像Firefox这样的第三方浏览器.我发现最接近禁用双击缩放的是这个
var lastTouchEnd = 0;
document.addEventListener('touchend', function (event) {
var now = (new Date()).getTime();
if (now - lastTouchEnd <= 300) {
event.preventDefault();
}
lastTouchEnd = now;
}, false);
从/sf/ask/17360801/
然而,该禁用快速点击完全,这虽然防止双敲击缩放,还可以防止快速输入值的用户.有没有办法允许快速按下按钮,同时还禁用双击缩放?
1> 小智..:
CSS属性touch-action
适合我.在iOS 11.1上测试过.
button {
touch-action: manipulation;
}
有关详细信息,请参阅MDN:https://developer.mozilla.org/en-US/docs/Web/CSS/touch-action
这仅适用于块级元素/具有已知高度和宽度的元素。内联元素仍将具有默认的浏览器触摸行为。