Я создаю страницу вопросов и ответов в виде гармошки для недавнего проекта. Ответ на вопрос открывается при нажатии на вопрос. Мой подход заключается в том, чтобы скрыть ответ с помощью max-height = 0 и overflow = Hidden. Когда вопрос нажимается, он обновляет значение индекса, что делает имя класса ответа активным.
Затем для max-height устанавливается большее значение, что дает ответ.
Код: Выделить всё
.answer{
max-height: 0;
overflow: hidden;
margin-left:5rem;
transition: ease 0.7s;
}
.answer.active{
padding-bottom: 2rem;
max-height: 500px;
}
Проблема заключается в том, что когда я закрываю ответ, переход происходит с постоянной скоростью, но затем замедляется прямо перед полным закрытием. То же самое происходит и при открытии ответа, хотя это менее заметно.
Я попробовал изменить тип перехода на «облегченный-выход», думая, что возникла проблема с закрывающимся переходом. . Но это не решило проблему. Других переходов, которые могли бы повлиять на эту часть страницы, нет.
Подробнее здесь:
https://stackoverflow.com/questions/793 ... ding-a-div