Как добавить анимацию у addClass?

Question

[Андрей Решетов]

Всем привет. У меня возник вопрос при создании калькулятора. Как анимировать addClass и removeClass? Через css вообще не робит. Через jquery ui тоже почему-то не работает. Кто может скинуть решение? Желательно с примером) Спасибо заранее)

Comments

[Dima Polos]

Добавлять класс по буквам)

[Lander]

Dima Polos, Два наркомана в театре после третьего звонка:
- Слушай, а как они так делают, чтобы свет так медленно тух?
- Заходит человек в аппаратную и меееедленно выдёргивает вилку из розетки.

Answer 1

[supertrolyaso]

Если ты хочешь чтобы при добавлении\удалении класса для которого прописаны стили, эти стили применялись/удалялись анимировано (плавно), просто в css этому элементу задай transition.

Если я тебя неправильно понял, исправь меня, или переформулируй вопрос.

Comments

[Андрей Решетов]

У меня есть кнопка, на нее нажимаешь и появляется блок с помощью addClass, то есть добавляется класс со свойством display: block. Мне нужно, чтобы это появление было красивым, то есть сделать анимацию

[supertrolyaso]

Если используешь jquery можешь убить 2х зайцев использованием $('#block').fadeIn(скорость анимации в мс);
Или $('#block').show(скорость анимации в мс);

[Dima Polos]

Андрей Решетов, display none/block анимировать не получиться, там надо хитрее все делать, менять какие-то свойства объекта, чтоб он был невидим или наоборот видим, потом только назначать ему display none/block.

[supertrolyaso]

Dima Polos, Согласен, но если в проекте используется jq то можно анимированно скрывать \ показывать элементы, используя fadeIn\show; Изначально ответил про transistion ибо не знал что именно нужно анимировать, в вопросе не было указано, о каких свойствах речь.

Answer 2

[Александр]

Попробуйте посмотреть вот это. Может поможет.
Анимация JQ