Требует ли модальное наложение абсолютное позиционирование?

Question

Вот JS скрипка, о чем я говорю:

http://jsfiddle.net/r77K8/98/

Моей накладка дает такой вид, отключила связь, но связь все еще остается кликабельна. Я просмотрел некоторые примеры модальных диалоговых окон в надежде найти решение. Насколько я могу судить, мне нужно использовать абсолютное позиционирование.

Я не решаюсь это сделать, потому что на самом деле мой контент динамически заполнен. Кажется, что много добавленной работы, чтобы попытаться сохранить наложение правильных размеров - мне действительно нравится, как это выглядит прямо сейчас, я просто хотел бы сделать элементы управления незаметными, в то время как наложение является родительским. Это возможно?

Answer 1

В вашем примере, похоже, что у вас есть содержимое, которое вы пытаетесь отключить ВНУТРИ Оверлейного div. Чтобы это сработало, вам нужно поместить оверлейный div поверх содержимого, поэтому поместите его после вашего содержимого. Таким образом, он закрывает ваш контент div.

И да, ваш оверлей должен иметь абсолютное позиционирование, чтобы вы поместили его в верхнем правом углу родительского контейнера и дали ему 100% ширину и высоту, чтобы он покрывал весь родительский контейнер.

См. Пример this jsfiddle.

---

EDIT:

Попробуйте this example вместо этого. Поместите содержимое и наложение в контейнер. Таким образом, наложение будет занимать только эту часть страницы.

Обратите внимание, что для этого необходимо, чтобы контейнерные divs (divLink1 и divLink2) должны иметь position:relative. В соответствии с описанием absolute в this link «Элемент расположен относительно его первого позиционированного (не статического) элемента предка». Таким образом, вы должны установить контейнеры в position:relative, но на самом деле их не перемещать.