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

Question

[drtvader]

Как сделать такую выплывающую форму? Какая структура должна быть в html? что бы форма выдвигалась при клике на кнопку Задать вопрос, а затем эта же кнопка отправляла данные с формы?

Answer 1

[drtvader]

$(document).ready(function() {
    // раскрыть панель
    $(".b-form-contact").submit(function()
    {
        if ($(".b-form__feedback").css('display') == 'block') {
            $(this).attr('data-validate', true);
        } else {
            //блок анимации
            $(".b-form__feedback").slideDown("slow");
            //блок анимации заканчивается
            return false;
        }
    });
});

<div class="b-form">
                <form class="b-form-contact" method="post" action="handler.php" data-validate="false">
                    <div class="b-form__feedback">
                        <div class="form-group">
                            <input type="name" class="b-form__input js-validation-change" data-rules="req;min=2" placeholder="Имя"></input>
                        </div>
                        <div class="form-group">
                            <input type="tel" class="b-form__input js-validation-change" data-rules="req;phone" placeholder="Телефон"></input>
                        </div>
                        <div class="form-group">
                            <input type="email" class="b-form__input js-validation-change" data-rules="email;req;" placeholder="Email"></input>
                        </div>
                        <div class="form-group">
                            <textarea type="text" class="b-form__input js-validation-change" rows="3" data-rules="req;min=2" placeholder="Ваш вопрос"></textarea>
                        </div>
                    </div>
                    <input type="submit" class="b-form__submit" value="Задать вопрос"/>
                </form>
            </div>