4

ズームしたときにズームするピンチのinnerWith/ビューポート幅を知りたい。

500 px未満の場合は、次のように画像を変更します。

$("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/

誰かが答えを持っていますか？

4

1 に答える 1

3

検出したいのは 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/

ピンチ前ピンチ後

于 2013-02-04T17:10:06.590 に答える