Можно ли анимировать свойство zoom css?

Question

Можно ли анимировать анимацию увеличения

Я пробовал это, но это все равно, что использовать свойство css для его установки.

$(this).animate({
    zoom: 0.5
}, 500);

Высота анимации работает и т. Д.

Answer 1

Попробуйте это:

-moz-transform: scale(2); 
-webkit-transform: scale(2);
-o-transform: scale(2);

**, но в настоящее время вы не можете анимировать их с помощью базового jQuery.

Однако для этого вы можете использовать плагин jQuery, например jquery.transform.js.

Обратите внимание, что IE9 также поддерживает свойство transform, я нашел некоторую информацию об этом в этом SO вопросе. **

Answer 2

Вы даже можете сделать это с помощью jQuery:

jQuery(this).hover(function() {
        jQuery(this).animate({
                marginTop: '-10px', //Bring image to top a little bit
                marginLeft: '-10px',
                width: '30px', //Zoom by 30 px
                height: '30px' 
            }, 500); /* 500 is the speed of how fast/slow image animates */

        } , function() {
        jQuery(this).animate({
                width: '15px', //Bring image back to original size
                height: '15px'
            }, 500);
    });