Фоновое затемнение и менюшка.
На многих сайтах есть такая фишка:
Когда куда-либо кликаешь, затемняется все остальное и в центре вылазит диалог. Как осуществить такое же, но чтобы вылазил не диалог, и картинка? И как делается это затемнение? |
Это экран накрывают сверху полупрозрачной панелью черного или белого цвета и максимальным 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. |