Я использую следующий код для наложения div.Если нажимаются ссылки «логин» или «регистрация», тогда div id="overlay" закрывает страницу.Код использует jQuery.
Он отлично работает в Firefox и Chrome, но не работает в IE6.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE8" />
<script type="text/javascript" src="jquery-ui-1.8.16.custom/development-bundle/jquery-1.6.2.js"></script>
<title> </title>
</head>
<style>
#overlay
{
position:absolute;
width:100%;
height:100%;
top:0;
left:0;
bottom:0;
right:0;
background: #CCCCCC;
z-index:100;
}
#log_in
{
height:25px;
width:130px;
float:right;
color:#00000;
line-height:1.7em;
margin-top:0px;
}
.login,.register
{
color: #000000;
font-size:14px;
font-weight:bold;
}
</style>
<body>
<script type="text/javascript">
$(function() {
$('.login,.register').click (function() {
$('#overlay').fadeIn('fast');
});
$('#overlay').click(function() {
$(this).fadeOut('fast');
});
});
</script>
<div id="overlay" style="display:none; position:absolute"></div>
<div id="log_in"><a href="#" class="login">Login</a> ¦ <a href="#" class="register" >Register </a></div>
</div>
</body>
</html>