使用 JavaScript/Hammer.js 检测 Android 捏以缩放 innerWidth

Question

我想知道缩放时要缩放的innerWith/viewport宽度。

如果它低于 500 像素，我想更改图像：

$("img#ad").attr("src", "http://img0.www.suckmypic.net/img/1/L/mmy4jT8s/jsFiddle3.png");

我尝试过这样的事情：

var hammer = new Hammer(document.getElementById("log"));

hammer.ontransformstart = function(ev) {
    var pziW = "test"; // Declare here the innerWidth of the pinch to zoom
    if (pziW < 500) {
        $("img#ad").attr("src", "http://img0.www.suckmypic.net/img/1/L/mmy4jT8s/jsFiddle3.png");
    }
};
hammer.ontransform = function(ev) {
    var pziW = "test"; // Declare here the innerWidth of the pinch to zoom
    if (pziW < 500) {
        $("img#ad").attr("src", "http://img0.www.suckmypic.net/img/1/L/mmy4jT8s/jsFiddle3.png");
    }
};
hammer.ontransformend = function(ev) {
    var pziW = "test"; // Declare here the innerWidth of the pinch to zoom
    if (pziW < 500) {
        $("img#ad").attr("src", "http://img0.www.suckmypic.net/img/1/L/mmy4jT8s/jsFiddle3.png");
    }
};

但我不知道如何声明捏的innerWidth 来缩放。

这里是 jsFiddle：

http://jsfiddle.net/nLvu6/

有人有答案吗？

Answer 1

您想要检测的不是 innerWidth。

看看传递给锤子函数的 ev 变量：

distance: 0
distanceX: 0
distanceY: 0
originalEvent: TouchEvent
position: Object
rotation: 124.85234015769826
scale: 2.0725083746457824
touches: Array[0]
type: "transformend"
__proto__: Object

scale: 2.0725083746457824 是我们想要的。如果比例高于或低于某个阈值，则执行图像替换功能。

我已经分叉了你的 JSFiddle。见这里：http://jsfiddle.net/BFBrU/14/