position fixed в IE6
Народ, помогите, кто знает.
Нужно, чтобы по нажатии на ссылку по середине окна(как по горизонтали, так и по вертикали) плавно появлялся скрытый div с затемнением остальной части экрана, что-то вроде lightbox'а. На самом div'е будет форма. Если пользователь нажимает вне этого блока, он(блок) также плавно удаляется с экрана.
Проблемы:
1) я сам - не очень(даже "почти не") шарю в JS.
2) position: fixed и IE не знакомы друг с другом
Привожу код того, что на данный момент удалось забубенить:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<script type="text/javascript" src="jquery-1.4.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#m").css("height", $(document).height());
$("#b").click(function(){
$("#m").fadeIn("fast");
$("#map").fadeIn("fast");
return false;
});
$("#m").click(function(){
$("#m").fadeOut("fast");
$("#map").fadeOut("fast");
return false;
});
});
$(window).bind("resize", function(){
$("#m").css("height", $(document).height());
});
</script>
<style>
#map { position: fixed; background-color: #00f; top: 50%; left: 50%; margin:-240px 0 0 -320px; width: 640px; height: 480px; z-index: 200; display: none; opacity: 1; -moz-opacity: 1; -khtml-opacity: 1; filter:progid:DXImageTransform.Microsoft.Alpha(opacity=100);}
* html #map {
position: absolute;
top: expression(document.getElementsByTagName( 'body' )[0].scrollTop +200+ "px");
left: 50%;
margin:-240px 0 0 -320px;
}
</style>
</head>
<body>
<div id="map">123</div>
<a href="#" id="b">показать блок</a><Br><Br><Br><Br><Br><Br><Br><Br><Br><Br><Br><Br><Br><Br><Br><Br><Br><Br><Br><Br><Br><Br><Br><Br><Br><Br><Br><Br><Br><Br><Br><Br><Br><Br><Br><Br><Br><Br><Br><Br><Br><Br><Br><Br><Br><Br><Br><Br><Br><Br><Br><Br><Br>
<div id="m" style="background-color: #000000;position:absolute; top:0; left:0; width:100%; z-index:100; display: none; opacity: .3; -moz-opacity: 0.3; -khtml-opacity: 0.3; filter:progid:DXImageTransform.Microsoft.Alpha(opacity=30);" onclick=""> </div>
</body>
</html>
Просьба сильно не возмущаться, еще раз говорю, я с JS далеко не на Ты. Лучше помогите закроссбраузерить это дело, или просто объективно и конструктивно покритикуйте. |