скрыти div по клику в любом месте документа
Здравствуйте.
подскажите пожалуйста, где ошибка? Нажав на кнопку хочу увидеть рядом с ней соответствующий див. А затем, нажав в любом месте документа (в том числе и на сам этот див и на ту же кнопку) хочу этот див скрыть.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<style type="text/css">
#qw
{
position: absolute;
top: 0px;
left: 0px;
width: 100%;
height: 100%;
display: none;
}
</style>
<script type='text/javascript'>
function findPosX(obj) {
var currleft = 0;
if (obj.offsetParent)
while (obj.offsetParent) {
currleft += obj.offsetLeft
obj = obj.offsetParent;
}
else if (obj.x) currleft += obj.x;
return currleft;
}
function findPosY(obj) {
var currtop = 0;
if (obj.offsetParent)
while (obj.offsetParent) {
currtop += obj.offsetTop
obj = obj.offsetParent;
}
else if (obj.y) currtop += obj.y;
return currtop;
}
function open_sk(x) {
bx = findPosX(document.getElementById('skbut'+x));
by = findPosY(document.getElementById('skbut'+x));
el = document.getElementById('qw');
di = document.getElementById('sk'+x);
di.style.left = bx;
di.style.top = by + 10;
di.style.visibility = 'visible';
el.innerHTML = di;
el.style.display = 'block';
}
function close_sk() {
el = document.getElementById('qw');
//el.innerHTML = '';
el.style.display = 'none';
}
</script>
</head>
<body>
<div id="qw" onclick="close_sk()"></div>
<div id="sk0" style="visibility: hidden; position: absolute;">000000000</div>
<div id="sk1" style="visibility: hidden; position: absolute;">111111111</div>
<button id="skbut0" onclick="open_sk('0')">Button 1</button>
<br><br><center>
<button id="skbut1" onclick="open_sk('1')">Button 2</button>
</center>
</body>
</html>
Огромнейшее заранее спасибо! |
onclick="close_sk()" тогда уж надо на боди повесить.
|
ZoNT,
если повесить на боди див вообще не откроется, кнопка для открытия тоже в боди, ведь? Я зарегистрировался, вот код с подсветкой:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<style type="text/css">
#qw
{
position: absolute;
top: 0px;
left: 0px;
width: 100%;
height: 100%;
display: none;
}
</style>
<script type='text/javascript'>
function findPosX(obj) {
var currleft = 0;
if (obj.offsetParent)
while (obj.offsetParent) {
currleft += obj.offsetLeft
obj = obj.offsetParent;
}
else if (obj.x) currleft += obj.x;
return currleft;
}
function findPosY(obj) {
var currtop = 0;
if (obj.offsetParent)
while (obj.offsetParent) {
currtop += obj.offsetTop
obj = obj.offsetParent;
}
else if (obj.y) currtop += obj.y;
return currtop;
}
function open_sk(x) {
bx = findPosX(document.getElementById('skbut'+x));
by = findPosY(document.getElementById('skbut'+x));
el = document.getElementById('qw');
di = document.getElementById('sk'+x);
di.style.left = bx;
di.style.top = by + 10;
di.style.visibility = 'visible';
el.innerHTML = di;
el.style.display = 'block';
}
function close_sk() {
el = document.getElementById('qw');
//el.innerHTML = '';
el.style.display = 'none';
}
</script>
</head>
<body>
<div id="qw" onclick="close_sk()"></div>
<div id="sk0" style="visibility: hidden; position: absolute;">000000000</div>
<div id="sk1" style="visibility: hidden; position: absolute;">111111111</div>
<button id="skbut0" onclick="open_sk('0')">Button 1</button>
<br><br><center>
<button id="skbut1" onclick="open_sk('1')">Button 2</button>
</center>
</body>
</html>
|
так на кнопку надо стопПропогейшн делать и менять действие припоказе...
|
ZoNT,
Будьте добры в качестве примера, пожалуйста. Я знакомство с JS два дня назад начал =( |
времени нет примеры писать. погугли.
|
Мне вот интересно, тут каждый второй говорит, что он в js второй день, и хочет, чтобы ему написали простейший код. Яндекс для таких отменили чтоли? Я почему-то всегда находил ответы на свои вопросы. А если не находил, значит мало кто это знает, следовательно вероятность того, что на форуме ответят маленькая.
Дмитрий С., специально для вас: Набираем http://yandex.ru/yandsearch?text=%D0...cript&from=fx3 видим на 4 месте этот же сайт http://javascript.ru/start/events/click переходим к соответствующему пункту http://javascript.ru/start/events/cl...tsii-brauziera втыкаем |
Kolyaj,
Уважаемый, я не просил дать мне готовый скрипт. Я просил о любом примере. мне написали стопПропогэйшен, я погуглил и набрал StopPropogation, смысл понял, но не понял как конкретно применить в деле. Поэтому о примере и попросил.
...
if (event.preventDefault)
event.preventDefault()
else
event.returnValue= false
return false
это не поможет человеку, знающему язык на уровне "поставь фиговину сюда наугад" Спасибо за помощь, тему можно закрыть. |
Цитата:
|
| Часовой пояс GMT +3, время: 16:33. |