jQueryを使用した.blur関数の問題

Question

画像を拡大するアプリケーションがあります focus() ズームアウトします blur(). 。元の画像サイズを読み、ズームイン効果を作成するために15pxを追加しました。これは正常に機能します。問題は、私が読んだ元の画像サイズを渡そうとしているズームアウト効果にあることです .blur() しかし、運はありません。誰かが私がこの問題を解決するのを手伝ってくれますか？

Answer 1

これが機能するデモです 次のコードの。

まず、あなたは電話をかけていませんでした $.data() メソッドオン orgW と orgH あなたの中で .blur() 関数。また、私はあなたを変更しました .blur() あなたと同様の実装を持つ機能 .focus() ズームアウトを機能させるための機能：

$('button:has(img)').blur(function() {

    if (timer !== null) clearTimeout(timer);

    var $image = $(this).find('img');

    $image.each(function() {
        $(this).animate({
            'width': $.data(this, 'orgW') + 'px',
            'height': $.data(this, 'orgH') + 'px',
        }, 500);
    });

});

Answer 2

使用することもできます '+=15' と '-=15' アニメーション関数。幅と高さを保存する必要はありません。

$('button:has(img)').focus(function() {
    $(this).find('img').animate({
        width: '+=15',
        height: '+=15'
    }, 500);
});

$('button:has(img)').blur(function() {
    $(this).find('img').animate({
        'width': '-=15',
        'height': '-=15'
    }, 0);
});

デモ

編集：これで機能するはずです。