Проблема с функцией .blur с использованием jQuery

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);
});

Демо

РЕДАКТИРОВАТЬ: Теперь это должно работать.