Как сделать display видимым?

Question

[hollanditkzn]

Мне нужно реализовать так чтобы при нажатие становится видимым окошечка и когда на другое место нажимаешь то она пропадает. Я попробовал реализовать, но во первых она не появляется.
https://jsfiddle.net/hollanditkzn/ayp5gyao/4/
То есть мне нужно для уведомление, при нажатие на иконку должна мини окно выглядывать, а при повторном нажатие или в другое место кликнуть окошечко должно пропадать?

Comments

[alex]

пятилетний ребенок и то четче сформулирует свои мысли чем вы. ну или вы иностранец и вопрос задали через google translate

Answer 1

[Иван Вишневский]

https://jsfiddle.net/ayp5gyao/5/

Comments

[hollanditkzn]

круто работает. А можно же сделать, так чтобы в другом месте кликнул то становится

[Иван Вишневский]

hollanditkzn: смотрите обработчики событий. Сейчас обработчик событий висит на ссылке, при желании можно повесить его на любой элемент, даже на body.

[hollanditkzn]

Иван Астапов: Типо вот так? https://jsfiddle.net/hollanditkzn/ayp5gyao/7/
Или какой-то другой элемент нужно указывать не через getElementByTagName

[Иван Вишневский]

hollanditkzn: тогда лучше так
https://jsfiddle.net/ayp5gyao/8/

[hollanditkzn]

Иван Астапов: Тогда при нажатие на ссылку не работает

[hollanditkzn]

Иван Астапов: может надо or добавить?

[Иван Вишневский]

hollanditkzn: по нажатию на ссылку работает. Просто событие срабатывает два раза - сначала показывает, потом закрывает. По-хорошему, по нажатию на ссылку надо вешать обработчик на window, в котором будет classList.delete('hidden'), а с самой ссылки убирать обработчик события, и наоборот, при нажатии на window снимать обработчик с window, и возвращать на ссылку.

[Иван Вишневский]

hollanditkzn: есть второй вариант - на body повесить classList.remove, а на ссылку - classList.add.