6

有谁知道在用户捏合或双击以放大/缩小 JavaScript 页面后如何获取视口的大小（以像素为单位）或缩放值？

我试过使用 window.innerWidth 但结果好坏参半。有时它似乎准确地给出了视口显示的像素数，但是，如果我在页面上放大然后大捏以缩小，window.innerWidth 将在 600-700 左右，即使它只是显示约 200 像素的页面。该页面只有 400 像素宽，当您缩小超出页面大小时，它没有显示您看到的“你走得太远”的方格背景。

如果我做一些小动作来放大和缩小，window.innerWidth 似乎工作得很好。不幸的是，我不能依赖用户只做小的捏手势:)

我也尝试在手势事件对象上使用 scale 属性，但我发现这不可靠，因为当您重新加载页面或使用后退/前进按钮导航到它时，您并不总是知道初始比例。使用元标记来指定它。

最终，我正在尝试制作一个应用程序，当用户试图缩小超出最大缩放级别时，我会知道，所以如果有其他方法可以做到这一点，我有兴趣了解它:)

这是我用来获取 innerWidth 的代码：

document.body.addEventListener('gestureend', function (evt) {
    console.log(window.innerWidth); // inaccurate when doing large pinch gestures
}, false);

谢谢！

4

1 回答 1

2

如果您只是想限制最大缩放级别，则可以使用 Safari 特定的视口控制标签：

<meta name="viewport" content="maximum-scale=2.0">

有关详细信息，请参阅 Safari 移动特定视口元标记规范。

于 2010-06-03T03:51:08.143 回答