motya88 Опубликовано 29 июня, 2016 Жалоба Поделиться Опубликовано 29 июня, 2016 Товарищи, не могу разобраться с меню.Есть вот такое меню:<ul class="left-menu"> <li id="id0" class="parent"> <a href="">Категория_1<span class="arrow"></span></a> <div class="catalog-section-childs" style=""> <div class="catalog-section-child"> <a href=""> <span class="child"> <span class="image"> <img src="" width="50" height="50" alt=""> </span> <span class="text">Подкатегория 1</span> </span> </a> </div> <div class="catalog-section-child"> <a href=""> <span class="child"> <span class="image"> <img src="" width="50" height="50" alt=""> </span> <span class="text">Подкатегория 2</span> </span> </a> </div> </div> </li> <li id="id1" class="parent"> <a href="">Категория_2<span class="arrow"></span></a> </li> </ul> и вот такой скрипт:{literal} <script type="text/javascript"> //<![CDATA[ $(function() { $('.showsection').click(function() { var clickitem = $(this); if(clickitem.parent('li').hasClass('')) { clickitem.parent('li').addClass('active'); } else { clickitem.parent('li').removeClass('active'); } if($('.showsubmenu').parent('li').hasClass('active')) { $('.showsubmenu').parent('li').removeClass('active'); $('.showsubmenu').parent('li').find('ul.submenu').css({'display':'none'}); } if($('.showcontacts').parent('li').hasClass('active')) { $('.showcontacts').parent('li').removeClass('active'); $('.header_4').css({'display':'none'}); } if($('.showsearch').parent('li').hasClass('active')) { $('.showsearch').parent('li').removeClass('active'); $('.header_2').css({'display':'none'}); $('div.title-search-result').css({'display':'none'}); } clickitem.parent('li').find('.catalog-section-list').slideToggle(); }); $('.showsectionchild').click(function() { var clickitem = $(this); if(clickitem.parent('div').hasClass('active')) { clickitem.parent('div').removeClass('active'); } else { clickitem.parent('div').addClass('active'); } clickitem.parent('div').parent('div').find('.catalog-section-childs').slideToggle(); }); }); //]]></script><script type="text/javascript"> //<![CDATA[ $(function() { $('.showsubmenu').click(function() { var clickitem = $(this); if(clickitem.parent('li').hasClass('')) { clickitem.parent('li').addClass('active'); } else { clickitem.parent('li').removeClass('active'); } if($('.showsection').parent('li').hasClass('active')) { $('.showsection').parent('li').removeClass('active'); $('.showsection').parent('li').find('.catalog-section-list').css({'display':'none'}); } if($('.showcontacts').parent('li').hasClass('active')) { $('.showcontacts').parent('li').removeClass('active'); $('.header_4').css({'display':'none'}); } if($('.showsearch').parent('li').hasClass('active')) { $('.showsearch').parent('li').removeClass('active'); $('.header_2').css({'display':'none'}); $('div.title-search-result').css({'display':'none'}); } clickitem.parent('li').find('ul.submenu').slideToggle(); }); var lis = $('.submenu').find('li'); for(var i = 0; i < lis.length; i++) { if($(lis).hasClass('item-selected')) { $(lis).addClass('active'); var ul = $(lis).find('ul:first'); $(ul).css({display: 'block'}); } } $('.showchild').click(function() { var clickitem = $(this); if(clickitem.parent('span').parent('li').hasClass('active')) { clickitem.parent('span').parent('li').removeClass('active'); } else { clickitem.parent('span').parent('li').addClass('active'); } clickitem.parent('span').parent('li').find('ul:first').slideToggle(); }); }); //]]></script><script type="text/javascript"> //<![CDATA[ $(function() { var popupItems = $("ul.left-menu").find('> li.parent'), popupNumItems = $("ul.left-menu").find('> li.parent').length; for(i = 0; i < popupNumItems; i++) { eval('var timeOut'+popupItems.id); } $("ul.left-menu > li.parent").hover(function() { var li = $(this), uid = li.attr("id"), pos = li.offset(), top = pos.top - 5, left = pos.left + li.width() + 9; eval("timeIn"+uid+" = setTimeout(function(){ li.find('> .catalog-section-childs').show(15).css({'top': top + 'px', 'left': left + 'px'}); }, 200);"); eval("clearTimeout(timeOut"+uid+")"); }, function(){ var li = $(this), uid = li.attr("id"); eval("clearTimeout(timeIn"+uid+")"); eval("timeOut"+uid+" = setTimeout(function(){ li.find('> .catalog-section-childs').hide(15); }, 200);"); }); }); //]]></script>{/literal} Помогите пожалуйста разобраться как меню натянуть на вывод категорий. Спасибо Цитата Ссылка на сообщение Поделиться на другие сайты
motya88 Опубликовано 29 июня, 2016 Автор Жалоба Поделиться Опубликовано 29 июня, 2016 блин.. пока вот так. Скажите плиз как решить {* Рекурсивная функция вывода дерева категорий *} {function name=categories_tree} {if $categories} <ul class="left-menu"> {foreach $categories as $c} {* Показываем только видимые категории *} {if $c->visible} <li id="" class="parent"> {if $c->image} <img src="{$config->categories_images_dir}{$c->image}" alt="{$c->name}"> {/if} <a {if $category->id == $c->id}class="selected"{/if} href="catalog/{$c->url}" data-category="{$c->id}">{$c->name}<span class="arrow"></span></a> {if in_array($category->id, $c->children)} <div class="catalog-section-childs" style=""> <div class="catalog-section-child"> {categories_tree categories=$c->subcategories} <a href=""> <span class="child"> <span class="image"> <img src="" width="50" height="50" alt=""> </span> <span class="text"></span> </span> </a> </div> </div> {/if} </li> {/if} {/foreach} </ul> {/if} {/function} {categories_tree categories=$categories} Цитата Ссылка на сообщение Поделиться на другие сайты
motya88 Опубликовано 29 июня, 2016 Автор Жалоба Поделиться Опубликовано 29 июня, 2016 меню должно быть как на картинке Цитата Ссылка на сообщение Поделиться на другие сайты
Рекомендуемые сообщения
Присоединяйтесь к обсуждению
Вы можете написать сейчас и зарегистрироваться позже. Если у вас есть аккаунт, авторизуйтесь, чтобы опубликовать от имени своего аккаунта.