jQuery 移动 : change font size on pinch-in/pinch-out?

Question

我正在使用 JQM 编写一个网络文档阅读器。我不希望我的用户在阅读时不断从右向左滚动，所以我的视口(viewport)是:

<META NAME='viewport' CONTENT='width=device-width; initial-scale=1.0; maximum-scale=1.0; minimum-scale=1.0; user-scalable=1;' />

不过，我知道由于不同的视觉技能，用户对字体大小的偏好可能会发生变化......因此，我认为在多点触控缩小操作(“捏合”)上缩小字体大小，并在多点触控缩放操作(“捏合”)上放大字体大小会很好......

这可能吗？除了 JQM 之外，我还需要一些外部库吗？

Answer 1

这在 jQuery Mobile 上是可能的，但您需要使用名为 hammer.js 的第三方实现。 .

它支持大量手势，例如:

• 按住
• 点击
• 双击
• 拖动、dragstart、dragend、dragup、dragdown、dragleft、dragright
• 滑动、向上滑动、向下滑动、向左滑动、向右滑动
• 转换、转换开始、转换结束
• 旋转
• 捏、捏、捏
• 触摸(手势检测开始)
• 释放(手势检测结束)

示例:

$('#test_el').hammer().on("pinchin", ".nested_el", function(event) {
    console.log(this, event);
});

$('#test_el').hammer().on("pinchout", ".nested_el", function(event) {
    console.log(this, event);
});

它可以与 jQuery Mobile 配合使用，这一点很重要。但您应该考虑一些其他想法，或者至少是针对 Android 2.X 设备的另一种想法，因为该平台不支持多点触控事件。

还有一些其他第三方实现，例如 Touchy 。不幸的是，Touchy 仅支持捏合。