Как сделать, чтобы выпадающее меню не закрывалось по клику правой кнопкой мыши?

Question

[pashabomber]

Добрый день!

На сайте bnews.kz/ru в самой верхней части есть меню с двумя выпадающими списками (два первых пункта). Если выпадающий список открыть и кликнуть в любом месте правой кнопкой мыши, то выпадающий список закрывается. Подскажите, пожалуйста, как это исправить.

HTML меню (пункты не как на сайте, просто для наглядности сюда код):

<ul class="drop-menu-main">
	<li>
		<span class="drop-down"><a href="#">Пункт 1</a></span>
		<ul class="drop-menu-main-sub">
			<li><a href="#">Подпункт 1</a></li>
			<li><a href="#">Подпункт 2</a></li>
			<li><a href="#">Подпункт 3</a></li>
		</ul>
	</li>
	<li>
		<span class="drop-down"><a href="#">Пункт 2</a></span>
		<ul class="drop-menu-main-sub">
			<li><a href="#">Подпункт 1</a></li>
			<li><a href="#">Подпункт 2</a></li>
			<li><a href="#">Подпункт 3</a></li>
		</ul>
	</li>
	<li>
		<span class="drop-down"><a href="#">Пункт 3</a></span>
	</li>
	<li>
		<span class="drop-down"><a href="#">Пункт 4</a></span>
	</li>
</ul>

JS меню:

function hideallDropdowns() {
        $(".dropped .drop-menu-main-sub").hide();
        $(".dropped").toggleClass('dropped');
        $(".dropped .drop-menu-main-sub .title").unbind("click");
    }

    function showDropdown(el) {
        var el_li = $(el).parent().addClass('dropped');
        el_li
            .find('.title')
            .click(function () {
                hideallDropdowns();
            })
            .html($(el).html());

        el_li.find('.drop-menu-main-sub').show();
    }

    $(".drop-down").click(function () {
        showDropdown(this);
    });

    $(document).mouseup(function () {
        hideallDropdowns();
    });

Заранее спасибо за помощь!

Answer 1

[romy4]

в mouseup проверять дополнительно, какая кнопка была нажата. mouseup срабатывает на любое отпускание кнопки мыши

Answer 2

[Александр Мельниченко]

копай в сторону свойства which события click.link