Плавный переход css?

transition для display не работает

Переходы работают для всех свойств.
Но нужно понимать, что некоторые свойства имеют только дискретные значения.
Переход между дискретными значениями не может быть плавным. Но он есть. Дискретный.

Сергей delphinpro, ну, то есть, иными словами, переходы для display не работают :))

Рустам Байназаров, LOL

Сергей delphinpro, да ладно, им же главное понять на начальном этапе, что они могут (ре)анимировать, а что нет.

Рустам Байназаров, Думал вы не успеете ответить, уже удалил коммент =)

Похоже я не совсем прав..
Для display реально не работает.
Но вместе с тем для visibility, который тоже дискретен, работает как-то странно
https://jsfiddle.net/Lxk1shta/

надо будет освежить знания в этом вопросе =)

Сергей delphinpro, эх, запутали :)

Я уже начал искать информацию о том, как анимируется display под капотом. Мол, оно анимируется, просто без промежуточных шагов, т. е. визуально нельзя отследить. Просто тут диссонанс в понимании, ибо тогда хотя бы работали transition-delay и transition-duration, но они тоже не работают. Там все всегда мгновенно и без задержек.

Для нормального анимирования visibility придется использовать opacity совместно с ним:


Тут хороший список всех анимируемых свойств:
https://developer.mozilla.org/en-US/docs/Web/CSS/C...