Подскажите по яваскрипту меню

Тема в разделе "JavaScript", создана пользователем TAKOY, 4 дек 2014.

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

    TAKOY Постоялец

    Регистр.:
    24 фев 2008
    Сообщения:
    76
    Симпатии:
    5
    Всем доброго времени суток, подскажите пожалуйста, что дописать в коде чтобы появилось подменю, вот пример
    http://learn.javascript.ru/play/tutorial/browser/events/sliding/index.html
    там раскрывается только одно меню, а как можно сделать подменю, чтобы к примеру раскрывались все остальные пункты подменю.
    Заранее спасибо.
     
  2. Venegrad

    Venegrad Создатель

    Регистр.:
    16 янв 2014
    Сообщения:
    10
    Симпатии:
    1
    Если вы хотите создать многоуровневое меню, вам необходимо написать функцию добавления классов, и через них влиять на отображение меню:

    На примере:

    $("li.menunav").click(function() {
    $(this).children("ul").toggleClass("js-active");
    });

    В таком случае, при нажатии на li, во вложенном в нем ul будет добавляться и убираться класс js-active, по его исчезновению вы можете задать блоку display: none, а по его присуствию display: block.
     
  3. TAKOY

    TAKOY Постоялец

    Регистр.:
    24 фев 2008
    Сообщения:
    76
    Симпатии:
    5
    я извиняюсь, если вам не сложно, на примере того кода что я предоставил вы можете создать меню из двух пунктов, и в этих пунктах по одному подпункту, например

    КОФЕ
    заварное
    растворимое
    Чай
    индийский
    японский

    Чтобы только при нажатии на КОФЕ или ЧАЙ раскрывались подпункты.
    Я просто не разбираюсь в коде, методом тыка или на примере, методом замены и копирования готового кода могу чтото сделать(((
     
  4. Q_BASIC

    Q_BASIC

    Регистр.:
    30 ноя 2013
    Сообщения:
    352
    Симпатии:
    223
  5. TAKOY

    TAKOY Постоялец

    Регистр.:
    24 фев 2008
    Сообщения:
    76
    Симпатии:
    5
    Да практически то, что нужно, только меню необходимо вертикальное, и чтобы подменю открывались только по щелчку.

    Через пару минут нашел на том сайте, что вы дали в пример и вертикальное меню и менно по щелчку открывается, благодарю!!! Буду пробовать.

    К сожалению не подошло, так как нужно еще и файл с яваскриптом закачивать, а нужен только хтмл код.
     
  6. Q_BASIC

    Q_BASIC

    Регистр.:
    30 ноя 2013
    Сообщения:
    352
    Симпатии:
    223
    Можно javascript в <script></script> на страницу поставить, или прямо с их сайта грузить
     
  7. TAKOY

    TAKOY Постоялец

    Регистр.:
    24 фев 2008
    Сообщения:
    76
    Симпатии:
    5
    К сожалению ничего путного не получилось, все же, если кто сможет помочь, то пожалуйста напишите по моему первому сообщению в этой теме, чтобы получилось так -

    вы можете создать меню из двух пунктов, и в этих пунктах по одному подпункту, например

    КОФЕ
    заварное
    растворимое
    Чай
    индийский
    японский

    Чтобы только при нажатии на КОФЕ или ЧАЙ раскрывались подпункты.
    Хочется получить готовый код, чтобы можно было подставлять и менять необходимые значения.
     
  8. vytyacom

    vytyacom Постоялец

    Регистр.:
    19 ноя 2014
    Сообщения:
    136
    Симпатии:
    54
    Наваял тут простенькую штуку
    http://jsfiddle.net/vytya/wpe7ht7p/
    Правда есть баг. Когда оба открыты, то надо 2раза нажать чтоб закрылось. Ну это так. Решение базовое.
    Дальше дело стилизации.
    Вообще если нужно чтото такое в рамках контента, то можно какойнить скрипт аккордиона использовать. Либо куча готовых для меню есть. Типа Суперфиша.
     
    TAKOY нравится это.
  9. TAKOY

    TAKOY Постоялец

    Регистр.:
    24 фев 2008
    Сообщения:
    76
    Симпатии:
    5
    Спасибо за потраченное время!!! Но к сожалению так я и делаю, вернее такое меню сделал, правда код огромнейший получился, у вас намного меньше, но нужно чтобы еще и подменю раскрывалось, вот как вы сделали, нажимаеш на кофе, пункт раскрывается и появляется РАСТВОРИМЫЙ и НЕРАСТВОРИМЫЙ, так чтобы еще когда нажимаеш на РАСТВОРИМЫЙ и НЕРАСТВОРИМЫЙ они тоже раскрывались (если там чтото есть). Ну вот например в пункте РАСТВОРИМЫЙ добавить ЯКОБЗ и НЕСКАФЕ


    14.36
    Вот на примере наваял код, но загвоздка в том, что подменю раскрываются все одновременно, блин уже почти сделал))) Помогите знающие, как сделать теперь чтобы раскрывалось подменю только при нажатии, ну или хотябы при наведении (как сейчас), чтобы не все подменю сразу открывались и все в кучу друг на друга лезло.
    http://learn.javascript.ru/play/93rD4b
     
    Последнее редактирование: 6 дек 2014
  10. TAKOY

    TAKOY Постоялец

    Регистр.:
    24 фев 2008
    Сообщения:
    76
    Симпатии:
    5
    В общем погуглил, научился в хтмл страницу вставлять и js скрипт и стили цсс, создал в этом хтмл файле меню и через

    <?php
    include_once ("menu.html");
    ?>

    подключил к сайту (тоже не умел и нашел способ через гугл). Плохо только что все новые материалы (ссылки на материалы) нужно прописывать вручную в хтмл файл меню, но ничего, статьи не так часто добавляю.