Обычно модальные окна и диалоги делаются при помощи плагинов jQuery. Например, SimpleModal или jqModal. К сожалению, все они, в варианте по умолчанию, работают неправильно.
Если окно модальное, то пользователю нельзя позволять прокручивать страницу под ним. При этом, если содержимого в модальном окне очень много, нужно позволить это содержимое прокручивать.
По этому принципу работает просмотр фото в Facebook и Вконтакте.
Для реализации подобного функцианала частенько нагромождают тонны JavaScript, хотя можно обойтись почти чистым CSS (за исключением навешивания одного класса на контейнер).
Немного прокомментирую:
/* Данный класс навешивается на контейнер при открытии модального окна. Для нормальных браузеров это body, для стырах IE — html */ .lock { /* Скрываем скроллбары */ overflow: hidden; } .modal { /* По умолчанию не показываем содержимое модальных окон */ display: none; } .lock .modal { /* Показываем подложку (полупрозрачное затенение) при открытии модального окна */ display: block; /* Саму подложку фиксируем и растягиваем на всё пространство */ position: fixed; bottom: 0; left: 0; top: 0; right: 0; /* Если содержимое модального окна в подложку не влезает — показываем скроллбары */ overflow: auto; }
