Диалоговое окно

Ссылка вызова диалогового окна

<a href="#">Вход</a>

Само диалоговое окно

<!-- Диалоговое окно Авторизации пользователя -->
<div id="dialog" class="back-dialog">

<!-- Блок с нашим контентом -->
<div class="dialog-content">// Текст <a href="#">Закрыть</a></div>
</div>

Содержание файла скрипта

$(document).ready(function(){
 $("#dialog").hide(); //скрываем окно при загрузке страница
 });

function opendialog(){
 $("#dialog").fadeIn(); //плавное появление блока
 }

function closedialog(){
 $("#dialog").fadeOut(); //плавное исчезание блока
 }

Содержание файла стилизации

/* Делаем затемнение заднего плана */
.back-dialog{
 width:100%;
 min-height:100%;
 background-color: rgba(0,0,0,0.5);
 overflow:hidden;
 position:fixed;
 top:0px;
 z-index: 9100;
 display: none;
}
/* Позиционируем блок с контентом */
.dialog-content{
 position: relative;
 overflow: hidden;
 overflow-y: auto;
 padding: 0 10 0 10;
 margin:40px auto 0px auto;
 min-width:150px;
 max-width:400px;
 min-height: 150px;
 max-height: 600px;
 background-color: #c5c5c5;
 border-radius: 0 0 5 5;
}