Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 13.11.2008, 14:01
Дмитрий С.
 
Сообщений: n/a

скрыти 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>


Огромнейшее заранее спасибо!

Последний раз редактировалось Андрей Параничев, 16.11.2008 в 00:16. Причина: Пользуйтесь bb-кодами [js] и [html] для оформления листингов кода в теле сообщения.
Ответить с цитированием
  #2 (permalink)  
Старый 13.11.2008, 14:05
Флудер
Отправить личное сообщение для ZoNT Посмотреть профиль Найти все сообщения от ZoNT
 
Регистрация: 25.07.2008
Сообщений: 1,271

onclick="close_sk()" тогда уж надо на боди повесить.
Ответить с цитированием
  #3 (permalink)  
Старый 13.11.2008, 14:14
Новичок на форуме
Отправить личное сообщение для Дмитрий С. Посмотреть профиль Найти все сообщения от Дмитрий С.
 
Регистрация: 13.11.2008
Сообщений: 3

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>

Последний раз редактировалось Дмитрий С., 13.11.2008 в 14:16.
Ответить с цитированием
  #4 (permalink)  
Старый 13.11.2008, 14:49
Флудер
Отправить личное сообщение для ZoNT Посмотреть профиль Найти все сообщения от ZoNT
 
Регистрация: 25.07.2008
Сообщений: 1,271

так на кнопку надо стопПропогейшн делать и менять действие припоказе...
Ответить с цитированием
  #5 (permalink)  
Старый 13.11.2008, 14:55
Новичок на форуме
Отправить личное сообщение для Дмитрий С. Посмотреть профиль Найти все сообщения от Дмитрий С.
 
Регистрация: 13.11.2008
Сообщений: 3

ZoNT,
Будьте добры в качестве примера, пожалуйста. Я знакомство с JS два дня назад начал =(
Ответить с цитированием
  #6 (permalink)  
Старый 13.11.2008, 15:21
Флудер
Отправить личное сообщение для ZoNT Посмотреть профиль Найти все сообщения от ZoNT
 
Регистрация: 25.07.2008
Сообщений: 1,271

времени нет примеры писать. погугли.
Ответить с цитированием
  #7 (permalink)  
Старый 13.11.2008, 16:11
Новичок на форуме
Отправить личное сообщение для Kolyaj Посмотреть профиль Найти все сообщения от Kolyaj
 
Регистрация: 19.02.2008
Сообщений: 9,177

Мне вот интересно, тут каждый второй говорит, что он в 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
втыкаем
Ответить с цитированием
  #8 (permalink)  
Старый 13.11.2008, 17:59
Новичок на форуме
Отправить личное сообщение для Дмитрий С. Посмотреть профиль Найти все сообщения от Дмитрий С.
 
Регистрация: 13.11.2008
Сообщений: 3

Kolyaj,
Уважаемый, я не просил дать мне готовый скрипт. Я просил о любом примере.
мне написали стопПропогэйшен, я погуглил и набрал StopPropogation, смысл понял, но не понял как конкретно применить в деле.
Поэтому о примере и попросил.


...
if (event.preventDefault)
    event.preventDefault()
else
    event.returnValue= false
return false

это не поможет человеку, знающему язык на уровне "поставь фиговину сюда наугад"

Спасибо за помощь, тему можно закрыть.
Ответить с цитированием
  #9 (permalink)  
Старый 14.11.2008, 10:42
Новичок на форуме
Отправить личное сообщение для Kolyaj Посмотреть профиль Найти все сообщения от Kolyaj
 
Регистрация: 19.02.2008
Сообщений: 9,177

Сообщение от Дмитрий С.
я не просил дать мне готовый скрипт.
А я про всех говорил.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск