«Базовый» div для захвата «внешних» событий

Question

У меня есть вопрос, похожий на это и это .У меня есть меню, которое появляется поверх другого контента по нажатию кнопки.Я хочу, чтобы меню закрывалось, если пользователь щелкает в любом месте за пределами меню.Есть много других «вещей», которые можно нажимать, когда меню открыто - я хочу, чтобы любой щелчок закрывал мое меню.По сути, я хочу, чтобы меню было модальным, чтобы я мог видеть, что за ним стоит, и любой внешний щелчок закрывает его, не активируя то, на что вы нажали.

Я создал div с абсолютным позиционированием в z-порядке чуть ниже div контейнера меню.«Базовый» div имеет событие щелчка, чтобы закрыть меню.Когда базовый элемент имеет цвет фона, чтобы я мог его видеть, все отлично работает.Но я хочу, чтобы этот базовый div был прозрачным.Когда я удаляю фоновый цвет, он больше не получает событие щелчка!

Ответы на связанный вопрос предложили добавить событие щелчка к телу или самому документу, чтобы закрыть меню, но я не хочусделать это, потому что меню не будет все время.Кроме того, когда он отключен, нет необходимости фиксировать клики.

Что мне нужно сделать с «нижележащим» div, чтобы сделать его прозрачным, но при этом захватить событие клика?

РЕДАКТИРОВАТЬ: То, что работает, но не имеет особого смысла, таково:

1. Стиль нижележащего div должен иметь цвет фона.
2. В jQuery установите его непрозрачность равной 0.

Теперь div прозрачен и фиксирует события.???

Answer 1

Прозрачный фон позволяет фоновым элементам проходить, изменяя его на непрозрачность 0, все еще нажимая на фон.Это было бы то же самое, что добавить 1x1 clear .gif или .png и выложить его на фон - это позволяет что-то, чтобы можно было кликать: ссылка .

Спасибо!

Answer 2

У меня была похожая проблема.Я создал массив needsClickInfo, и каждый раз, когда нажатие кнопки регистрировалось на экране, он вызывал объекты / функции, хранящиеся в needsClickInfo.Конечно, вам придется обновить needsClickInfo в функциях onMouseEnter() и onMouseLeave() объекта / элемента, с которым вы имеете дело, в данном случае, в строке меню.