Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 17.01.2012, 20:22
Аспирант
Отправить личное сообщение для jsuse Посмотреть профиль Найти все сообщения от jsuse
 
Регистрация: 10.04.2010
Сообщений: 92

Как отловить обратное событие "click" ?
Вот есть меню у Гугла (см. картинку)



Открывается только когда нажмешь на звездочку (красный крестик). А закрывается, когда кликаешь где угодно за пределами открытого меню (зеленый крестик). Так вот вопрос. Как найти этот зеленый крестик, второй клик, чтоб закрывать меню?

Открыть просто. Можно например так:
var x = document.getElementById("star");                // это id звездочки
var y = document.getElementById("hiddenMenu");          // это id меню, у которого display = none;
x.onclick = function() {
	y.style.display = "block";
}

А вот как сделать, чтоб его закрыть? Попробовал сделать так, через главный тег body:
var bar = document.getElementsByTagName("body")[0];
bar.onclick = function() {
   if (y.style.display == "block") {
      y.style.display = "none";
   }
}

Но получается, что он его только открыв, тут же и прячет. То есть сначала присваивает "block", так как кликнули по "star", но и тут же присваивает "none", так как кликнули и по "body".

Я пока вижу решение такое: написать код отлавливания нужного таргета события для body (отсекать все ненужные элементы). Но это какой-то прямой простецкий путь. Мне кажется, что должно быть какое-то другое решение, более лаконичное. Ведь так на body может висеть уйма разных меню и других захлопывающихся элементов. Неужели на body все их нужно тогда вешать? В общем, как это можно реализовать иначе?
Ответить с цитированием
  #2 (permalink)  
Старый 17.01.2012, 20:24
Интересующийся
Отправить личное сообщение для vamfirius Посмотреть профиль Найти все сообщения от vamfirius
 
Регистрация: 01.07.2010
Сообщений: 29

Сделать прозрачный див на всю страницу и повесить на него событие закрытия меню?
Ответить с цитированием
  #3 (permalink)  
Старый 17.01.2012, 22:16
Аватар для Magneto
Люмус, Емаксос Developer!
Отправить личное сообщение для Magneto Посмотреть профиль Найти все сообщения от Magneto
 
Регистрация: 06.05.2010
Сообщений: 677

1. Events bubbling и events capturing
2. На body навешивать событие onclick только при клике по звездочке\крестику, а потом когда пользователь где нибудь кликает по боди менять видимость меню и снимать событие с body и так далее.
Ответить с цитированием
Ответ


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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Как вызвать событие после события определенного в onchange Наталья Events/DOM/Window 2 12.09.2009 12:51
Как создать событие? remitmaster Общие вопросы Javascript 9 26.07.2008 17:31
как проверить поддеружет браузер определенное событие? GOll Элементы интерфейса 9 24.07.2008 13:40
Как вставить событие внутрь document.write Vivasvan Events/DOM/Window 8 13.06.2008 19:02
Как обработать событие Cresh Events/DOM/Window 1 31.05.2008 05:17