Фоновое затемнение и менюшка.
На многих сайтах есть такая фишка:
Когда куда-либо кликаешь, затемняется все остальное и в центре вылазит диалог. Как осуществить такое же, но чтобы вылазил не диалог, и картинка? И как делается это затемнение? |
Это экран накрывают сверху полупрозрачной панелью черного или белого цвета и максимальным z-индексом, например:
<html>
<body>
<script>
function test1()
{
document.getElementById('zanaves').style.display = 'block';
document.getElementById('pic').style.display = 'block';
};
function test2()
{
document.getElementById('zanaves').style.display = 'none';
document.getElementById('pic').style.display = 'none';
};
</script>
текст на сайте<br>
<img src="http://javascript.ru/forum/images/ca_serenity/misc/logo.gif"><br>
<div id="zanaves" style="position:absolute; left:0; top:0; width:100%; height:100%; text-align:center; display:none; z-index:1000;">
<div style="position:absolute; left:0; top:0; width:100%; height:100%; background-color:#000; opacity:.7;"></div>
<img id="pic" style="position:relative; left:20%; top:5%; display:none; z-index:1" src="http://gigalit.info/img/avon.jpg">
</div>
<input style="position:relative; z-index:1001" type="button" value="затемнить" onclick=test1()>
<input style="position:relative; z-index:1001" type="button" value="растемнить" onclick=test2()>
</body>
</html>
|
как еще один вариант http://javascript.ru/forum/xhtml-htm...tml#post322555
|
| Часовой пояс GMT +3, время: 04:34. |