Joomla 1.5 Выпадающее меню на jQuery

Тема в разделе "Программирование", создана пользователем TroL, 30.03.2011.

  1. Offline

    TroL специалист

    Регистрация:
    01.03.2011
    Сообщения:
    502
    Симпатии:
    34
    Пол:
    Мужской
    написал скрипт для выпадания вертикального меню. вот скрипт
    Код (CODE):
    1. <script type="text/javascript" language="javascript">  
    2.   $.noConflict();
    3.   $(document).ready(function($) {
    4.  
    5.  function initMenu() {
    6.    $('.menu_menu  ul').hide();
    7.     $('.menu_menu li span').click(
    8.     function() {
    9.       var checkElement = $(this).next();
    10.          if ((checkElement.is('ul')) & (!checkElement.is(':visible'))) {
    11.         $('.menu_menu ul:visible').slideUp('normal');
    12.         checkElement.slideDown('normal');
    13.         return false;
    14.         }
    15.       }
    16.     );
    17.   }
    18. initMenu();});
    19.   </script>


    осталось сделать что бы открывался тот блок с которого был переход на матерьял, понял что при переходе по меню к нему присваивается класс class="parent active ..."

    как сделать что бы он находил класс "parent active" (команда $('.menu_menu li').hasClass('parent active') ),
    и делал именно этот список дочерних меню открытым.
     
    Последнее редактирование: 31.03.2011
  2.  
  3. woojin
    Offline

    woojin Местный Команда форума

    Регистрация:
    31.05.2009
    Сообщения:
    3 209
    Симпатии:
    335
    Пол:
    Мужской
    Re: Выподающее меню на jQuery

    алгоритм работы примерно такой:
    сначала надо запускать функцию которая будет узнавать какой в данный момент пункт активен (active),
    далее функцию раскрывающую этот пункт (хотя их можно объединить)
    и уже в самом конце должна срабатывать твоя функция для выбора нового пункта

    P.S. оформи правильно код
    P.P.S. для этого есть специальные теги/кнопки в горизонтальном меню над полем ввода текста ([​IMG], [​IMG], [​IMG])
     
  4. Offline

    TroL специалист

    Регистрация:
    01.03.2011
    Сообщения:
    502
    Симпатии:
    34
    Пол:
    Мужской
    Re: Выподающее меню на jQuery

    я все так и делал но на теории все легче...но на практике вот не работает и все, либо открывает но открывает все пункты. поэтому то я сюда и написал так как не смог на практике решить...
    если кто сталкивались с подобным можно и сразу кодом, хотя бы примерно что ни будь
     
  5. Offline

    TroL специалист

    Регистрация:
    01.03.2011
    Сообщения:
    502
    Симпатии:
    34
    Пол:
    Мужской
    структура меню с активным пунктом такое

    Код (html):
    1. <ul class="menu_menu">
    2. <li class="parent active item34"><span class="separator"><span>родительский пункт 1</span></span>
    3. <ul>
    4. <li id="current" class="parent active item80"><a href="/....."><span>пункт 1</span></a></li>
    5. <li class="item81"><a href="/...."><span>пункт 2</span></a></li>
    6. <li class="item82"><a href="/...."><span>пункт 3</span></a></li>
    7. <li class="item83"><a href="/..."><span>пункт 4</span></a></li>
    8. </ul>
    9. </li>
    10.  
    11. <li class="item35"><span class="separator"><span>родительский пункт 2</span></span>
    12. <ul>
    13. <li id="current" class="parent active item80"><a href="/....."><span>пункт 1</span></a></li>
    14. <li class="item84"><a href="/...."><span>пункт 2</span></a></li>
    15. <li class="item85"><a href="/...."><span>пункт 3</span></a></li>
    16. <li class="item86"><a href="/..."><span>пункт 4</span></a></li>
    17. </ul>
    18. </li>

    может кто то поможет?
    надо что бы ul из 3-строчки появлялся по нахождению класса в 4-строчке
     
  6. Offline

    TroL специалист

    Регистрация:
    01.03.2011
    Сообщения:
    502
    Симпатии:
    34
    Пол:
    Мужской
    если кому пригодится:
    Код (html):
    1. <script type="text/javascript" language="javascript">  
    2. $.noConflict();
    3. $(document).ready(function($) {
    4.     $('.menu_menu ul').hide();
    5.     $('.menu_menu li.active').find('ul').slideDown();
    6.     $('.menu_menu li span').click(
    7.     function() {
    8.       var checkElement = $(this).next();
    9.       if ((checkElement.is('ul')) & (!checkElement.is(':visible'))) {
    10.        $('.menu_menu ul:visible').slideUp('normal');
    11.         checkElement.slideDown('normal');
    12.         return false;
    13.         }
    14.       }
    15.     );
    16. });
    17. </script>
     
  7. Offline

    TroL специалист

    Регистрация:
    01.03.2011
    Сообщения:
    502
    Симпатии:
    34
    Пол:
    Мужской
    если кому пригодится:
    Код (html):
    1. <script type="text/javascript" language="javascript">  
    2. $.noConflict();
    3. $(document).ready(function($) {
    4.     $('.menu_menu ul').hide();
    5.     $('.menu_menu li.active').find('ul').slideDown();
    6.     $('.menu_menu li span').click(
    7.     function() {
    8.       var checkElement = $(this).next();
    9.       if ((checkElement.is('ul')) & (!checkElement.is(':visible'))) {
    10.        $('.menu_menu ul:visible').slideUp('normal');
    11.         checkElement.slideDown('normal');
    12.         return false;
    13.         }
    14.       }
    15.     );
    16. });
    17. </script>
     

Поделиться этой страницей

Загрузка...