Как проиграть анимацию внутри блока, при его появлении (opacity, display)?

Question

[MeMoJlor]

Есть меню. Нужно чтобы при появлении меню, проигралась внутри анимация с самого начало.
Сам изучил вопрос. Заметил что если в ручную убрать блок: display: none и снова его сделать видимым: display: block, то анимация начинает проигрываться с начало. Попытался сделать незаметную анимацию

animation: 10ms reply;
   animation-fill-mode: forwards;}
   @keyframes reply
   {0%{display: block;}
   50%{display: none;}
   100%{display: block;}}

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

Comments

[Ankhena]

Объясните по-русски, какого эффекта вы пытаетесь достичь?
https://jsfiddle.net/gpaqbmc4/
Если что, свойство display не анимируется. Используйте прозрачность, трансформации и т.д.

[MeMoJlor]

Ankhena, Спасибо за попытку помочь, я не стал реализовывать эту идею. По-русски: нужно чтобы при открытии меню, проигралась анимация появления пунктов.

[Ankhena]

MeMoJlor, добавляете класс при открытии и ему добавляете анимацию. Но только тех свойств, которые вообще анимируются.
https://jsfiddle.net/46rg1wyb/

[MeMoJlor]

Ankhena, Вроде пробовал и при повторных открытий, отказывался снова анимироваться. Может быть я ошибку допустил. Напишите ответ, я отмечу решением.

Answer 1

[Ankhena]

Добавляете класс при открытии и ему добавляете анимацию. Но только тех свойств, которые вообще анимируются. Свойство display не анимируется.
https://jsfiddle.net/46rg1wyb/