Как реализовать плавно выпадающий при появлении текст?

Question

[Sangwoo Kim]

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

Ссылка на JSFiddle

Comments

[Lukmann]

transform: translateY поработайте с этим

Answer 1

[Андрей Мартынкевич]

Вот примеры реализации появления текста:
1) Пример через translate
2) пример через top
P.s второй конечно тоже можно использовать, но анимация появления через top не рекомендуется, т.к вовремя появления может проскакивать "тряска".