Выпадающее меню

Тема в разделе "JavaScript", создана пользователем Hobbit, 27 мар 2013.

Модераторы: ZiX
  1. Hobbit

    Hobbit Создатель

    Регистр.:
    24 ноя 2006
    Сообщения:
    28
    Симпатии:
    26
    Есть простое выпадающее меню:
    JavaScript:
    function shiftMenu(n)
    {
    var el = document.getElementById('Menu'+n);
    if ( el.style.display == 'none' )
    el.style.display = 'block'
    else
    if ( el.style.display == 'block' )
    el.style.display = 'none';
    };


    HTML:
    <ul><li><a href="javascript:shiftMenu(1)">Раздел1</a></li></ul>
    <ul id="Menu1" style="DISPLAY: none;">
    <li><a href="#">Подраздел1</a></li>
    <li><a href="#">Подраздел2</a></li>
    <li><a href="#">Подраздел3</a></li>
    </ul>


    Все замечательно работает. Но как бы его изменить, чтобы выпавшее меню закрывалось после клика не пункту Раздел1, а по клику в любой области экрана?
     
  2. antiterror

    antiterror xProgramming

    Регистр.:
    22 авг 2007
    Сообщения:
    344
    Симпатии:
    135
    В гоогле много решений таких проблем, попробуй так, при нажатии пробежаться по всем li и закрыть все кроме той что у тебя должна открыться. Для этого используют FOR, но и каждый меню должно иметь свой ID
     
  3. Igor0001

    Igor0001 Создатель

    Регистр.:
    9 мар 2013
    Сообщения:
    15
    Симпатии:
    1
  4. denik

    denik Постоялец

    Регистр.:
    1 июл 2011
    Сообщения:
    80
    Симпатии:
    43
    Сама реализация:

    Добавьте в начало ф-ции события клика по пункту это:
    Код:
    event.stopPropagation();
    И добавьте еще общее событие:
    Код:
    $("body").click(function(){
    // здесь закрываете всплывающее меню
    });
    (это как бы теория, если хотите разобраться...)