Css3 анимация медленное сжатие блока и постановка по центру родителя?

Question

[Игорь Пушкарский]

Добрый день!

1. Есть такая задача сделать анимацию блока который лежит внутри другого блока размерами 300 на 200
2. После анимации блок должен принять размеры 240 на 160, и получить отступы одинаковые слева и справа, сверху и снизу
3. При анимации блок должен стать полупрозрачным

Кто подскажет как такое сделать что бы блок равномерно уменьшался со всех сторон?

И что бы анимация не тормозила нигде.

Внутри блока который сжимается есть еще с десяток обьектов.

Answer 1

[Денис Инешин]

Лучше всего сделать через scale, итоговый размер подберите на глазок, так как скейл оперирует пропорциями.

Comments

[Игорь Пушкарский]

Все бы хорошо но я вот не пойму как сделать, что бы в начале не было пульсирующего движения? То есть когда добавляется класс, картинка показывается сперва маленького размера, а потом начинает до нужных размеров уменьшаться.