問題描述

有沒有辦法禁用 electron 應用程序中的縮小縮放？

我不能讓它從 web-view 裏面正常工作的 JavaScript 方法，如下所述：https://stackoverflow.com/a/23510108/665261

看來--disable-pinch 標誌是 not supported by electron 。

我已經嘗試過各種方法：

  1. event.preventDefault()在 javascript touchmove/mousemove 事件

  2. HTML 中的 meta viewport 標籤

  3. -webkit-text-size-adjust 在 CSS 中

  4. 電子標誌/配置

一般來説，是否有任何方法用於 webkit，特別是 electron？

最佳解決思路

更新 2：

在渲染過程中使用 webFrame.setZoomLevelLimits(v0.31.1 +)(Differences Between Main Process and Renderer Process) 。因為 mac 上的智能縮放仍然可以使用 document.addEventListener 。

實施例 require('electron').webFrame.setZoomLevelLimits(1, 1)

更新：

deltaY 屬性用於縮小縮放有 float 的值，但正常滾動事件返回 int 的值。現在解決方案沒有 ctrl 鍵的問題。

Demo 2 。

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

使用 Chromium monitorEvents(document)我發現負責此事件 mousewheel 。我不知道為什麼 mousewheel 用捏縮動觸發。下一步，找到正常滾動和夾點縮放之間的區別。

捏合縮放具有屬性 e.ctrlKey = true，正常滾動事件具有 e.ctrlKey = false 。但是如果按住 ctrl 鍵並滾動頁面，e.ctrlKey 等於 true 。

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

Demo

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

次佳解決思路

桌面瀏覽器似乎很難防止捏縮。

這裏有一些想法！

1) 通過使用一些手勢 javascript 像 hammer.js，檢測 Pinch 事件並嘗試使用 e.preventDefault 來防止它

要麼

2) 使用 css 中的”%” 設計所有內容，或者使用像”vm” 等更新的單元 (如果可能的話) 。這樣，即使是頁面也會被放大，但是對於任何縮放級別，內容將保持不變。

祝一切順利！

參考文獻

注：本文內容整合自 Google/Baidu/Bing 輔助翻譯的英文資料結果。如果您對結果不滿意，可以加入我們改善翻譯效果：薇曉朵技術論壇。