CSS — всплывающий слой (с наложением и кнопкой закрытия)

Я не знаю, как описать то, что я хочу. Так что я просто нарисовал это: http://i.imgur.com/oMFzJ.jpg

Это то, что у меня есть до сих пор. Я не знаю, как получить этот оверлей

<div id="layer" style="background-color:#212121;border:2px solid #CCCCCC;width:450px;position:absolute;top:20%;left:20%;"> <iframe src="http://www.ebay.com" width="100%" height="300" frameborder="0" scrolling="no"></iframe> <div style="width:100%;"><span style="color:#CCCCCC;float:right;font-size:11px;margin:3px;cursor:pointer;" onclick="document.getElementById('layer').style.display='none';">Close X</span></div> </div>

overlay css layer
person Helena    schedule 05.04.2012    source источник

Ответы (2)


arrow_upward
1
arrow_downward

Быстрый способ создать модальное всплывающее окно – использовать для этого существующую библиотеку, рассмотрите Интерфейс jQuery

В будущем, пожалуйста, предоставьте более подробную информацию о том, что было испробовано и т. д.

person Oleg    schedule 05.04.2012

arrow_upward
1
arrow_downward

Мне нравится использовать fancybox для моих модальных всплывающих окон. В примерах на странице используются изображения, но вы можете вставить любой HTML-код.

person Alex Morales    schedule 05.04.2012
comment
Спасибо, но мне нужно больше похожего на код, который я написал (только что отредактировал свой вопрос)... просто отсутствует наложение - person Helena; 05.04.2012
comment
Вам нужно отформатировать код, который вы разместили, чтобы сделать его читаемым. Кроме того, вы пытались создать оверлей? В том, что вы написали, нет ничего, что могло бы действовать как таковое. - person Alex Morales; 05.04.2012
comment
в порядке. простите, я ооочень тупой. Я исправил проблему. Спасибо, в любом случае - person Helena; 05.04.2012
comment
Лол, не говорите, что мы все совершали глупые ошибки. Это приходит с территорией ;) Рад, что вы поняли это. - person Alex Morales; 05.04.2012