Question

我使用node webkit的Menu API构建了一个右键单击上下文菜单。我遇到的问题是当我增加页面的缩放比例时，例如从1到1.4，上下文菜单从我的鼠标光标偏离中心。有没有其他人遇到这个或有解决方法？

以下是我如何生成菜单：

// Load native UI library
var gui = require('nw.gui');

// Create an empty menu
var menu = new gui.Menu();

// Add some items
menu.append(new gui.MenuItem({ label: 'Item A' }));
menu.append(new gui.MenuItem({ label: 'Item B' }));
menu.append(new gui.MenuItem({ type: 'separator' }));
menu.append(new gui.MenuItem({ label: 'Item C' }));

// Remove one item
menu.removeAt(1);

// Popup as context menu
$(document).on("contextmenu", function() {
    menu.popup();
})

以下是API参考的链接：https://github.com/nwjs/nw.js/wiki/menu

Answer 1

我们可以根据以下内容调整为缩放级别调整的鼠标位置：

固定代码：

// Load native UI library
var gui = require('nw.gui');

// window (needed to get zoom level)
var win = gui.Window.get();

// Create an empty menu
var menu = new gui.Menu();

// Add some items
menu.append(new gui.MenuItem({ label: 'Item A' }));
menu.append(new gui.MenuItem({ label: 'Item B' }));
menu.append(new gui.MenuItem({ type: 'separator' }));
menu.append(new gui.MenuItem({ label: 'Item C' }));

// Remove one item
menu.removeAt(1);

// Popup as context menu
$(document).on("contextmenu", function(ev) {

    // transform zoom level into factor
    var zoomFactor = Math.pow(1.2, win.zoomLevel);

    menu.popup(
        Math.round(zoomFactor * ev.clientX),
        Math.round(zoomFactor * ev.clientY)
    );
})

上下文菜单在缩放时偏离中心

1 个答案: