$(function() { $('#popup').hide(); // скрыли фон и всплывающее окно $('#hide-layout').css({opacity: .5}); // кроссбраузерная прозрачность alignCenter($('#popup')); // центрировали окно $(window).resize(function() { alignCenter($('#popup')); // центрирование при ресайзе окна }) $('#click-me').click(function() { $('#hide-layout, #popup').fadeIn(300); // плавно открываем }) $('#btn-close, #hide-layout').click(function() { $('#hide-layout, #popup').fadeOut(300); // плавно скрываем }) $('#btn-yes, #btn-no').click(function() { alert('Выполнили какое-то действие, затем скрываем окно...'); // сделали что-то... $('#hide-layout, #popup').fadeOut(300); // скрыли }) // функция центрирования function alignCenter(elem) { elem.css({ left: ($(window).width() - elem.width()) / 2 + 'px', // получаем координату центра по ширине top: ($(window).height() - elem.height()) / 2 + 'px' // получаем координату центра по высоте }) } })