jenya_yaroshenko,
поискать по форуму "открывашка"
Закрытие блока по нажатию в любом месте
<!DOCTYPE HTML>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
</head>
<body>
<p>
<style type="text/css">
.divWin {position: relative; width:600px; height:250px; border:3px solid brown; background:white; display:none; padding:20px; text-align:left; margin-bottom: 40px}
.closetButton {position:absolute; top:0; right:0; border-bottom:6px solid brown; border-left:6px solid brown; font-weight:bold; cursor:pointer; padding:6px 8px} </style>
<script type="text/javascript">
function winOpen(id){
var obj=document.getElementById(id).style;
obj.display="block";
winOpen2(3, 0, obj);
};
function winOpen2(s, o, obj){//показываем окно
o+=s;
if(o<100){
obj.opacity=o/100;
obj.filter='alpha(opacity='+o+')';
setTimeout(function(){winOpen2(s, o, obj);}, 55);}
else{//показать полностью
obj.opacity=1;
obj.filter='alpha(opacity=100)';};
};
function winCloset(id){
winCloset2(5, 100, document.getElementById(id).style);
};
function winCloset2(s, o, obj){//скрываем окно
o-=s;
if(o>0){
obj.opacity=o/100;
obj.filter='alpha(opacity='+o+')';
setTimeout(function(){winCloset2(s, o, obj);}, 55);}
else{//обнуляем на выходе
obj.opacity=0;
obj.filter='alpha(opacity=0)';
obj.display="none";};
};
</script></p>
<p><input onclick="winOpen('div1');" type="button" value=" Провідний фахівець | Ярошенко Євгеній олегович " /></p>
<p> </p>
<div id="div1" class="divWin">
<div class="closetButton" onclick="winCloset('div1');">
Х</div>
<table border="0" cellpadding="0" cellspacing="0">
<tbody>
<tr>
<td style="width:219px;">
<p><b>Телефон зовнішній</b></p>
</td>
<td style="width:219px;">
<p>481-32-10</p>
</td>
<td rowspan="4" style="width:219px;">
<div>
<img src="http://noc.mon.gov.ua/files/tel_dovidnuk/foto/Yaroshenko.jpg" /></div>
</td>
</tr>
<tr>
<td style="width:219px;">
<p><b>Телефон внутрішній</b></p>
</td>
<td style="width:219px;">
<p>79-55</p>
</td>
</tr>
<tr>
<td style="width:219px;">
<p><b>e-mail</b></p>
</td>
<td style="width:219px;">
<p>yaroshenko@mon.gov.ua</p>
</td>
</tr>
<tr>
<td style="width:219px;">
<p><b>Кабінет</b></p>
</td>
<td style="width:219px;">
<p>28</p>
</td>
</tr>
<tr>
<td style="width:219px;">
<p><b>Адреса</b></p>
</td>
<td style="width:219px;">
<p>пр. Перемоги, 10</p>
</td>
</tr>
</tbody>
</table>
</div>
<p><input onclick="winOpen('div2');" type="button" value=" Провідний фахівець | Ярошенко Євгеній олегович " /></p>
<p> </p>
<div id="div2" class="divWin">
<div class="closetButton" onclick="winCloset('div2');">
Х</div>
<table border="0" cellpadding="0" cellspacing="0">
<tbody>
<tr>
<td style="width:219px;">
<p><b>Телефон зовнішній</b></p>
</td>
<td style="width:219px;">
<p>481-32-10</p>
</td>
<td rowspan="4" style="width:219px;">
<div>
<img src="http://noc.mon.gov.ua/files/tel_dovidnuk/foto/Yaroshenko.jpg" /></div>
</td>
</tr>
<tr>
<td style="width:219px;">
<p><b>Телефон внутрішній</b></p>
</td>
<td style="width:219px;">
<p>79-55</p>
</td>
</tr>
<tr>
<td style="width:219px;">
<p><b>e-mail</b></p>
</td>
<td style="width:219px;">
<p>yaroshenko@mon.gov.ua</p>
</td>
</tr>
<tr>
<td style="width:219px;">
<p><b>Кабінет</b></p>
</td>
<td style="width:219px;">
<p>28</p>
</td>
</tr>
<tr>
<td style="width:219px;">
<p><b>Адреса</b></p>
</td>
<td style="width:219px;">
<p>пр. Перемоги, 10</p>
</td>
</tr>
</tbody>
</table>
</div>
</body>
</html>