Мне нужно создать меню, которое бы показывалось при нажатии, скрывалось при нажатии на него второй раз и скрывалось при нажатии на фон вокруг. Я имею вот такой код, но последняя его часть (скрывать при клике на фоне) почему-то отключает первую (еще раз нажать на меню, чтобы его скрыть).
<!-- Кнопка -->
<a href="#" class="share-button">Share</a>
<!-- Появляющееся меню, скрытое в CSS по умолчанию -->
<div class="share-menu">
<a class="share-menu-link" href="#">Twitter</a>
</div>
$(document).ready(function() {
$(".share-button").click(function(e) {
e.preventDefault();
$(".share-menu").toggle();
$(".share-button").toggleClass("menu-open");
});
$(".share-menu").mouseup(function() {
return false;
});
$(document).mouseup(function(e) {
$(".share-button").removeClass("menu-open");
$(".share-menu").hide();
$(".share-menu").css("display","none");
});
});
Подскажите почему они мешают друг другу?
