JQuery анимация заполнения не работает правильно в Chrome

Question

У меня есть несколько вложенных элементов div, и у одного из них есть padding. Я пытаюсь анимировать заполнение этого div с помощью:

$("div").animate({paddingRight: 60});

Проблема в том, что в IE и FF размер вложенных элементов div корректируется, но не в Chrome. Посмотрите на мой пример здесь: http://jsfiddle.net/smashko/zu6aX/. Нажмите кнопки «Удалить заполнение» и «Добавить заполнение», чтобы увидеть, что происходит в FF и IE.

Почему он не работает в Chrome?

EDIT:

На самом деле, как указал Стефан, анимация работает правильно, но новые значения CSS не применяются.

Если вы щелкнете по элементу Inspect после завершения анимации, Chrome обновит его и все будет в порядке.

Итак, вопрос в том, как заставить Chrome автоматически применять анимированные CSS-значения?

Answer 1

Анимация работает просто отлично, но ваш CSS не показывает никакой разницы.

Обновлен ваш пример для использования функции обратного вызова в animate ().Проверьте консоль, чтобы увидеть значение до и после анимации: http://jsfiddle.net/dbDsM/

Вы также увидите, что оно работает, если вместо этого вы анимируете paddingLeft.

Answer 2

у меня это работало в Chrome (стабильно)

$("#one").click(function() {
    $("#inside3").animate({
        'padding': 60
    });
});
$("#two").click(function() {
    $("#inside3").animate({
        'padding': 30
    });
});