javascript - 在 webkit ( 电子或者电子) 中,禁用收缩缩放

  显示原文与译文双语对照的内容
0 0

是否可以在电子应用中禁用收缩缩放?

我无法从web-view中使用普通的javascript方法进行工作,如下所述: http://stackoverflow.com/a/23510108/665261

似乎 --disable-pinch 标志是不支持电子

我使用了多种方法,使用:

  1. event.preventDefault()touchmove/mousemove 事件
  2. HTML中的meta viewport 标记
  3. -webkit-text-size-adjust
  4. 电子的标志/配置

在一般情况下,web kit有任何方法,还是电子

时间:原作者:4个回答

0 0

使用 Chromium monitorEvents(document) 我发现这个事件 mousewheel 负责。 我不知道,为什么 mousewheel 用pinch缩放zoom触发。 下一步,查找普通滚动和收缩缩放之间的差异。

收缩缩放具有属性 e.ctrlKey = true,而普通滚动事件有 e.ctrlKey = false 。 但是如果按住 ctrl 键并滚动页面,e.ctrlKey 等于 true

我找不到更好的解决方案。 : (

演示

document.addEventListener('mousewheel', function(e) {
 if(e.ctrlKey) {
 e.preventDefault();
 }
});

更新:

收缩缩放的deltaY 属性具有 float 值,但普通滚动事件返回 int 值。 现在解决方案在ctrl键上没有问题。

演示 2

document.addEventListener('mousewheel', function(e) {
 if(e.deltaY % 1!== 0) {
 e.preventDefault();
 }
});
原作者:
0 0

桌面浏览器似乎很难防止收缩缩放。

下面是一些想法 !

1 ) 使用一些手势 javascript,比如 hammer.js,检测压缩事件,并尝试使用 e.preventDefault 阻止它

或者

2 ) 在css中使用"%"设计所有东西,或者使用"虚拟机"等新的单位,( 如果可能的话) 。 这样,即使页面会被缩放,但是任何缩放级别的内容都会保持不变。

所有最好的 !

原作者:
0 0

你为什么不能使用:

<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0"/>

把它放到头部,它保持设备不被缩放。

原作者:
0 0

元标记应该已经工作。 尝试使用 minimum-scale=1.0

<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, user-scalable=no">

如果它也不工作,那么同时添加最小和最大比例

<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">

P.S: 它将禁用对移动电话的缩放。

原作者:
...