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

Question

[Александр]

Здравствуйте. Напишите, пожалуйста, как реализуется форма, которая всплывает по середине экрана с затемненным фоном, когда нажимаешь на кнопку 'вход' ?

Лично я это вижу так: делаешь ссылку "вход" с переадресацией на авторизацию, которая в свою очередь реализуется с помощью js. в js мы задаем нужные нам стили - профит. поправьте, если я не прав.

P.s Буду благодарен, если вы накидаете пример реализации такой формы. Спасибо.

Answer 1

[Ivan Ukhov]

Верстаете всплывающее окно .window с "display: none" (если нужна анимация то "opacity: 0" ), создаёте в css класс:
.form--active {
display: block; (или opacity: 1;)
}

и через js вешаете данный класс при клике

$(document).ready(function(){
$(".button").on("click",function () {
$(".window").addClass("form--active");
});

Answer 2

[Ivanq]

Например так:
https://jsfiddle.net/Ivanq/rntazyLe/

Answer 3

[Максим Тимофеев]

кнопка вход открывает модальное окно с формой или подгружает в него форму ajax-om пользователь заполняет форму и отправляется post запрос, обрабатывается, заводится сессия и т.д. и переадресовывает пользователя на страницу на которой он был до этого,