$(document).ready(function() {

// Функция для обработки нажатия кнопки мыши на ссылки в классе popup
$('a.popup').click(function() {


// Переменная для хранения атрибута rel нажатой ссылки
var popupid = $(this).attr('rel');


// Теперь надо показать все, что принадлежит атрибуту rel
// Предположим, что атрибут rel нажатой ссылки - это popuprel. Тогда код ниже затеняет #popuprel
$('#' + popupid).fadeIn();


// Добавим div fade вниз тэга body
// и мы уже задавали ему стиль на шаге  2 : CSS
$('body').append('<div id="fade"></div>');
$('#fade').css({'filter' : 'alpha(opacity=80)'}).fadeIn();


// Теперь надо поместить модальное окно в центр вэбстраницы, когда она затенена
// Мы добавляем 10px к высоте и ширине
var popuptopmargin = ($('#' + popupid).height() + 10) / 2;
var popupleftmargin = ($('#' + popupid).width() + 10) / 2;


// Затем используем функцию .css для выравнивания модального окна по центру
$('#' + popupid).css({
'margin-top' : -popuptopmargin,
'margin-left' : -popupleftmargin
});
});



// Функция для обработки нажатия кнопки мыши на ссылки в классе popup
$('a.big_grey').click(function() {


// Переменная для хранения атрибута rel нажатой ссылки
var popupid = $(this).attr('rel');


// Теперь надо показать все, что принадлежит атрибуту rel
// Предположим, что атрибут rel нажатой ссылки - это popuprel. Тогда код ниже затеняет #popuprel
$('#' + popupid).fadeIn();


// Добавим div fade вниз тэга body
// и мы уже задавали ему стиль на шаге  2 : CSS
$('body').append('<div id="fade"></div>');
$('#fade').css({'filter' : 'alpha(opacity=80)'}).fadeIn();


// Теперь надо поместить модальное окно в центр вэбстраницы, когда она затенена
// Мы добавляем 10px к высоте и ширине
var popuptopmargin = ($('#' + popupid).height() + 10) / 2;
var popupleftmargin = ($('#' + popupid).width() + 10) / 2;


// Затем используем функцию .css для выравнивания модального окна по центру
$('#' + popupid).css({
'margin-top' : -popuptopmargin,
'margin-left' : -popupleftmargin
});
});





// Определяем еще одну функцию, которая используется для постепенного затенения слоя и открывания окна при нажатии на затененный слой
$('#fade').click(function() {


// ДОбавляем ids всех модальных окон здесь
$('#fade , #popuprel , #andrey , #yarik').fadeOut()
return false;
});
});