Посоветуйте хороший скрипт меню-аккордеон

[Torawhite]

Здравствуйте! Посоветуйте, пожалуйста, хороший скрипт меню типа "аккордеон". Возможно, кто-то использует. Перепробовал масссу, включая с завязкой на куках. Необходимо, чтобы он добавлял определенный класс всем родительским элементам списка и списки, имеющие этот класс раскрывались. по умолчанию закрыт, раскрывается по клику. Без куков, они слишком много следят

[afdw]

metisMenu Edited April 28, 2015 by afdw

[Torawhite]

  On 4/28/2015 at 5:52 PM, afdw said:

metisMenu

Спасибо! Буду пробовать...

[Andryshok]

Еще есть harmonika  http://masscode.ru/index.php/k2/item/51-liharmonica   . я так сам пишу обычно

[Torawhite]

  On 4/28/2015 at 7:50 PM, Andryshok said:

Еще есть harmonika  http://masscode.ru/index.php/k2/item/51-liharmonica   . я так сам пишу обычно

Спасибо! Сегодня вечеером оба попробую. Сам я в javascript разбираюсь плохо, во всяком случае, на данный момент(

[npofopr]

http://webcloud.se/jQuery-Collapse/

[afdw]

  On 4/29/2015 at 8:28 AM, npofopr said:

http://webcloud.se/jQuery-Collapse/

Зачем оно? Без анимации гораздо легче сделать на css.

[Torawhite]

  On 4/28/2015 at 5:52 PM, afdw said:

metisMenu

Не раскрывает список, если класс active выставляет сервер.

if(($category == $key) AND !isset($top)){echo " class='active'";}

И родительскому элементу списка класс active не присваивает

[Нарек]

Долго пользовался этим

[Torawhite]

  On 4/28/2015 at 7:50 PM, Andryshok said:

Еще есть harmonika  http://masscode.ru/index.php/k2/item/51-liharmonica   . я так сам пишу обычно

Этот скрипт не добавляет класс каждому родительскому элементу, не подсвечивает.Да и с моим списком работать отказывается

  On 4/29/2015 at 3:09 PM, Нарек said:

Долго пользовался этим

Спасибо! Но я пробовал, видимо, его же и она использует куки. С ними как раз и проблема - у меня несколько страниц, при переходе на которые необходимо сбрасывать куки, иначе он светит всё, что запомнил и это сбивает с толку. маялся с ним долго, но элегантного решения так и не нашёл. Тем более, он не раскрывал меню, если подсветку текущего раздела делает сервер - передаю параметр при помощи хлебных крошек обратно в раздел

[Andryshok]

  On 4/29/2015 at 6:17 PM, Torawhite said:

Этот скрипт не добавляет класс каждому родительскому элементу, не подсвечивает.Да и с моим списком работать отказывается

Дык а допилить разве проблема, класс добавлять нужно средствами серверного кода или у вас контент аяксом грузится.... сомневаюсь И что у вас за список? разве кто то отменял <ul><li></li></ul>  ?

Edited April 29, 2015 by Andryshok

[Torawhite]

  On 4/29/2015 at 7:53 PM, Andryshok said:

 

  On 4/29/2015 at 6:17 PM, Torawhite said:

Этот скрипт не добавляет класс каждому родительскому элементу, не подсвечивает.Да и с моим списком работать отказывается

Дык а допилить разве проблема, класс добавлять нужно средствами серверного кода или у вас контент аяксом грузится.... сомневаюсь И что у вас за список? разве кто то отменял <ul><li></li></ul>  ?

 

Без аякса. Список получаю так один:

global $category;echo "<li>";if($menu['childs']){echo "<a";if($category == $menu['id']){echo " class='active_category'";}echo " href='?parent=" . $menu['parent_id'] . "&category=" . $menu['id'] . "'>" . $menu['title'] . "</a><ul>" . map_tree_to_string($menu['childs']) ."</ul>";}else {echo "<a";if($category == $menu['id']){echo " class='parent active_category'";}echo " href='?parent=" . $menu['parent_id'] . "&category=" . $menu['id'] . "'>" . $menu['title'] . "</a>";}echo "</li>"

Так - второй:

foreach($cat AS $key => $item){if(count($item)>1){echo "<li><a";if(($parent == $key) AND !isset($top)){echo " class='active_parent'";} echo " href='#'><span></span>$item[0]</a><ul><li><a";if(($category == $key) AND !isset($top)){echo " class='active_category'";} echo " href = '?view=magazine_rubric&parent=$key&category=$key' target = '_self' >Все статьи</a></li>";$par = $key;foreach($item[sub] AS $key => $sub) {echo "<li><a";if(($category == $key) AND !isset($top)){echo " class='active_category'";} echo " href = '?view=magazine_rubric&parent=$par&category=$key' target = '_self' >$sub</a></li>";}echo "</ul></li>";}elseif($item[0]){echo "<li><a";if(($parent == $key) AND !isset($top)){echo " class='active_parent'";} echo " href='#'><span></span>$item[0]</a><ul><li><a";if(($category == $key) AND !isset($top)){echo " class='active_category'";} echo " href = '?view=magazine_rubric&parent=$key&category=$key' target = '_self' >Все статьи</a></li></ul></li>";}}

[jdk]

Вот не плохая подборка.

[Torawhite]

  On 4/30/2015 at 4:53 AM, jdk said:

Вот не плохая подборка.

Спасибо! Попробую!

[Torawhite]

  On 4/29/2015 at 7:53 PM, Andryshok said:

 

  On 4/29/2015 at 6:17 PM, Torawhite said:

Этот скрипт не добавляет класс каждому родительскому элементу, не подсвечивает.Да и с моим списком работать отказывается

Дык а допилить разве проблема, класс добавлять нужно средствами серверного кода или у вас контент аяксом грузится.... сомневаюсь И что у вас за список? разве кто то отменял <ul><li></li></ul>  ?

 

Класс добавить не проблема текущему и его родителю средствами сервера, а родителям выше как добавить я не знаю, не хватает опыта и знаний. Плюс мне нужно класс по клику добавлять - список раскрылся - загорелся, тут сервер бессилен. А список классический вывыденный список выглядит так:

<aside class="left_sidebar">    <ul class="left_sidebar_nav">        <li><a href='?parent=0&category=1'><span></span>Гардероб</a>    <ul><li><a href='?parent=1&category=3'><span></span>Мужской</a>    <ul><li><a href='?parent=3&category=5'><span></span>Одежда</a>    <ul><li><a href='?parent=5&category=11'>Куртки</a></li></ul></li><li><a href='?parent=3&category=6'>Обувь</a></li><li><a href='?parent=3&category=7'>Аксессуары</a></li></ul></li><li><a href='?parent=1&category=4'><span></span>Женский</a>    <ul><li><a href='?parent=4&category=8'><span></span>Одежда</a>    <ul><li><a href='?parent=8&category=12'>Куртки</a></li></ul></li><li><a href='?parent=4&category=9'>Обувь</a></li><li><a href='?parent=4&category=10'>Аксессуары</a></li></ul></li></ul></li><li><a href='?parent=0&category=2'>Электроника</a></li>    </ul></aside>

[Andryshok]

А по клику не надо показывать содержимое категории? просто раскрыть? ну можно  примерно так

 $('.spisok> ul > li > a').click(function(e) {        $('.catalog > ul > li').each(function() {            $(this).removeClass("selected");        });        if($(this).closest('li').find('ul').length){            $('.catalog ul ul').each(function() {                $(this).hide();            });            $(this).closest('li').addClass("selected");            $(this).closest('li').find('ul').show();            return false;        }	    });

А если дерево решили строить.... ну чем бы вам помочь... есть у меня собственная библиотека для CI строит дерево рекурсией на основе выборки query из базы и добавляет класс выбранному и родителям.... только подойдет ли она вам? а так могу поделиться впринципе, если поможет, сайт ваш на чем? на голом php али фреймворке али тормозуха CMS ?

Edited May 1, 2015 by Andryshok

[Torawhite]

  On 4/30/2015 at 11:53 PM, Andryshok said:

А по клику не надо показывать содержимое категории? просто раскрыть? ну можно  примерно так

 $('.spisok> ul > li > a').click(function(e) {        $('.catalog > ul > li').each(function() {            $(this).removeClass("selected");        });        if($(this).closest('li').find('ul').length){            $('.catalog ul ul').each(function() {                $(this).hide();            });            $(this).closest('li').addClass("selected");            $(this).closest('li').find('ul').show();            return false;        }	    });

А если дерево решили строить.... ну чем бы вам помочь... есть у меня собственная библиотека для CI строит дерево рекурсией на основе выборки query из базы и добавляет класс выбранному и родителям.... только подойдет ли она вам? а так могу поделиться впринципе, если поможет, сайт ваш на чем? на голом php али фреймворке али тормозуха CMS ?

Спасибо! Сайт на голом php. Выборку делаю по такому принципу . Выводится всё корректно, вроде. разобрался со криптом metisMenu . Но! при добавлении класса active он раскрывает список только, если один уровень вложенности, если li c классом active где-то глубоко, то он список не раскрывает и классы родителям не проставляет. Сайт для наглядности, над которым тружусь. Там два списка - в журнале список работает так, как нужно, а в маркете уровней вложенности больше, там работает некорректно

[Torawhite]

  On 5/1/2015 at 5:13 AM, Torawhite said:

 

  On 4/30/2015 at 11:53 PM, Andryshok said:

А по клику не надо показывать содержимое категории? просто раскрыть? ну можно  примерно так

 $('.spisok> ul > li > a').click(function(e) {        $('.catalog > ul > li').each(function() {            $(this).removeClass("selected");        });        if($(this).closest('li').find('ul').length){            $('.catalog ul ul').each(function() {                $(this).hide();            });            $(this).closest('li').addClass("selected");            $(this).closest('li').find('ul').show();            return false;        }	    });

А если дерево решили строить.... ну чем бы вам помочь... есть у меня собственная библиотека для CI строит дерево рекурсией на основе выборки query из базы и добавляет класс выбранному и родителям.... только подойдет ли она вам? а так могу поделиться впринципе, если поможет, сайт ваш на чем? на голом php али фреймворке али тормозуха CMS ?

Спасибо! Сайт на голом php. Выборку делаю по такому принципу . Выводится всё корректно, вроде. разобрался со криптом metisMenu . Но! при добавлении класса active он раскрывает список только, если один уровень вложенности, если li c классом active где-то глубоко, то он список не раскрывает и классы родителям не проставляет. Сайт для наглядности, над которым тружусь. Там два списка - в журнале список работает так, как нужно, а в маркете уровней вложенности больше, там работает некорректно

 

В скрипте есть строки, которые проверяют наличие класса active и раскрывают список

var $this = this;this.$element.find('li.active').has('ul').children('ul').addClass('collapse in');this.$element.find('li').not('.active').has('ul').children('ul').addClass('collapse');

Возможно, тут можно что-то поменять/добавить, чтобы он каждому родителю добвлял класс active и раскрывал, соответственно?

Скрипт, которым я пользовался до этого работал примерно так:

//open active level$this.find("li.active").each(function() {$(this).parents("ul").slideDown(opts.speed);$(this).parents("ul").parent("li").find("span:first").html(opts.openedSign);});

Edited May 1, 2015 by Torawhite