嵌入式 Google 地图上的捏合缩放可缩放整个页面

cai*_*lin 5 html javascript google-maps google-maps-api-3 pinchzoom

如何让捏合缩放功能在基于 Google 地图 v3 的网络应用程序中正常工作?现在,在触摸屏 Windows 8 设备上捏合将缩放整个页面,而不是地图。我已经在 Chrome 和 Firefox 中尝试过此操作,它在 Google 地图网站上可以正常工作,但在我的网站上却不行。

我的元素中有以下元标记<head>,但它似乎没有帮助。我还需要添加另一个元标记吗?我检查了 Google 地图网站的来源,但找不到任何看起来相关的元标记。

<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
Run Code Online (Sandbox Code Playgroud)

jim*_*mmy 0

这很可能是因为您使用的是覆盖层。

您可以通过添加以下代码来阻止捏合和拖动:

window.blockMenuHeaderScroll = false;
$(window).on('touchstart', function(e)
{
    if ($(e.target).closest('#map').length == 1)
    {
        blockMenuHeaderScroll = true;
    }
});
$(window).on('touchend', function()
{
    blockMenuHeaderScroll = false;
});
$(window).on('touchmove', function(e)
{
    if (blockMenuHeaderScroll)
    {
        e.preventDefault();
    }
});
Run Code Online (Sandbox Code Playgroud)

感谢/sf/answers/1201186661/