В этой статье описывается метод JS+CSS для реализации всплывающих окон DIV и потемнения фона. Поделитесь этим для вашей ссылки. Конкретный метод реализации следующим образом:
Скопируйте код следующим образом: <html>
<голова>
<title> JS+CSS Реализация всплывающего окна Div, а фон становится темнее </title>
<Скрипт>
функция блокировки () {
document.all.ly.style.display = "block";
document.all.ly.style.width = document.body.clientwidth;
document.all.ly.style.height = document.body.clientheight;
document.all.layer2.style.display = 'block';
}
function lock_checkform (theform) {
document.all.ly.style.display = 'none'; document.all.layer2.style.display = 'none';
вернуть ложь;
}
</script>
<стиль типа = "text/css">
<!-
.Style1 {font-size: 12px}
A: ссылка {
Цвет: #000;
Текстовое декорация: нет;
}
A: посетил {
Текстовое декорация: нет;
}
A: Hover {
Текстовое декорация: нет;
}
A: Active {
Текстовое декорация: нет;
}
->
</style>
<meta http-equiv = "content-type" content = "text/html; charset = gb2312">
</head>
<тело>
<p align = "center">
<input type = "button" value = "opup div" onclick = "locking ()" />
</p>
<div id = "ly" style = "Положение: Absolute; Top: 0px; Filter: Alpha (непрозрачность = 60); фоновый цвет: #777;
Z-Index: 2; слева: 0px; дисплей: нет; ">
</div>
<!-запуск плавающей закладки->
<div id = "layer2" align = "center" style = "Положение: Absolute; z-Index: 3; слева: выражение ((document.fofsetwidth-540)/2); top: выражение ((document.body.offsetheight-170)/10);
фоновый цвет: #fff; дисплей: нет; ">
<таблица cellPadding = "0" cellPacing = "0" style = "border: 0 Solid #e7e3e7;
пограничный коллапс: коллапс; ">
<tr>
<td style = "фоновый цвет: #73a2d6; цвет: #ffff; прокладки-лето: 4px; надоелокопленность: 2px;
шрифт-вес: жирный шрифт; размер шрифта: 12px; "valign =" middle ">
<div align = "right"> <a href = javaScript:; onclick = "lock_checkform (this);"> [close] </a> </div> </td>
</tr>
<tr>
<td align = "center">
<br> <br> <hr> <p align = "center"> <font color = red> Эти спецэффекты собираются из Интернета только для интереса и обучения и не для коммерческих целей. Источник: wulin.com </font> </p>
</td>
</tr>
</table>
</div>
<!-конец плавающей закладки->
</body>
</html>
Я надеюсь, что эта статья будет полезна для каждого программирования JavaScript.