Как сделать пошаговую форму?

Question

[yura_89]

Здравствуйте!
Есть задача реализовать пошаговую форму. Нашел в интернете несколько скриптов и плагинов (например, этот: www.jquery-steps.com/Examples#basic ), но у них у всех один принцип действия: для содержимого используется position:absolute, которому нужно задавать фиксированную высоту. Форма можно содержать разное количество полей, где-то больше, где-то меньше, и как следствие сложно предугадать и прописать высоту. А если этого не сделать, то поля не помешаются и часть из них пропадает.

Может кто сталкивался с подобным вопросом или даст совет по использованию другого скрипта или плагина?

Comments

[Dymok]

если форма не должна быть супер универсальной, то несложно сделать свой скрипт

[yura_89]

Dymok, через fadeIn / fadeOut ?

[Dymok]

Юрий Аванесов, если нужна анимация платного появдения/исчезания - да

[yura_89]

Dymok, я в этом, мягко скажем, не особо силен. А есть пример как это реализовать? Не конкретно саму функцию, а пошаговую форму, чтобы при клике назад/далее также плавно менялся контент...вот пока не могу сообразить, как грамотно это сделать.

[Dymok]

Юрий Аванесов, вот пример. Возможно не самый лучший, но не сложный и работает.
https://codepen.io/UnluckySerivelha/pen/BOQvjb

Answer 1

[Дмитрий Грабко]

https://codepen.io/gratulen/pen/eLBQVO