Показать сообщение отдельно
  #1 (permalink)  
Старый 26.01.2010, 14:22
Аспирант
Отправить личное сообщение для sdff Посмотреть профиль Найти все сообщения от sdff
 
Регистрация: 11.07.2008
Сообщений: 54

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="">&nbsp;</div>

</body>
</html>


Просьба сильно не возмущаться, еще раз говорю, я с JS далеко не на Ты. Лучше помогите закроссбраузерить это дело, или просто объективно и конструктивно покритикуйте.
Ответить с цитированием