misterk Опубликовано 18 июня, 2012 Жалоба Поделиться Опубликовано 18 июня, 2012 ак как же быть с 3 вложенностью??? Цитата Ссылка на сообщение Поделиться на другие сайты
filth Опубликовано 18 июня, 2012 Жалоба Поделиться Опубликовано 18 июня, 2012 .categories ul ul ul...... Цитата Ссылка на сообщение Поделиться на другие сайты
misterk Опубликовано 18 июня, 2012 Жалоба Поделиться Опубликовано 18 июня, 2012 А чуть чуть поподробней укажите пожалуйста?? Цитата Ссылка на сообщение Поделиться на другие сайты
filth Опубликовано 18 июня, 2012 Жалоба Поделиться Опубликовано 18 июня, 2012 значит я не понял вопроса, что именно нужно в 3й вложености??? Цитата Ссылка на сообщение Поделиться на другие сайты
misterk Опубликовано 18 июня, 2012 Жалоба Поделиться Опубликовано 18 июня, 2012 Прошу прощения - это я не правильно поставил вопрос...Как сделать вывод подподкатегорий (т.е. 3 вложенность).initMenu('.categories ul');function initMenu(id) { $(id + ' ul').hide().parent().addClass('subcat'); if($(id).find('a.selected')) { $(id).find('a.selected').addClass('selected').parents('ul').show().parents('li').show(); } else $(id + ' ul:first').show(); $(id + ' a').click( function() { checkElement = $(this).next(); if(checkElement.is('ul')) { if(!checkElement.is(':visible')) { $(id + ' ul:visible').slideUp('normal'); checkElement.slideDown('normal'); } else checkElement.slideUp('normal'); return false; } }); Цитата Ссылка на сообщение Поделиться на другие сайты
filth Опубликовано 18 июня, 2012 Жалоба Поделиться Опубликовано 18 июня, 2012 так вроде код вывода в шаблоне index.tpl за это отвечает, а скрипт только за анимацию. Я так понял у вас не выводятся вообще подПод категории? Цитата Ссылка на сообщение Поделиться на другие сайты
misterk Опубликовано 18 июня, 2012 Жалоба Поделиться Опубликовано 18 июня, 2012 C данным скриптом все выводится, но:-> Выводится список главных категорий, при нажатии на нее, все как положено, меню раздвигается и выводится список подкатегорий.-> Если есть вложенные элементы в подкатегорию (т.е. подподкатегории - 3 вложенность), то при клике на подкатегорию меню снова схлапывается, а именно категории... А вот при повторном клике уже снова раскрывается полностью до 3 вложенности, т.е. до подподкатегорий...Нужно в функции дописать --> при клике на подкатегорию показывать ее подкатегорию... анимация аналогично... Вопрос что именно, я в jquery не силен??? Цитата Ссылка на сообщение Поделиться на другие сайты
filth Опубликовано 18 июня, 2012 Жалоба Поделиться Опубликовано 18 июня, 2012 Странно, именно с этим скриптом всё нормально работало (сейчас у меня меню такое) Цитата Ссылка на сообщение Поделиться на другие сайты
njckn Опубликовано 24 июля, 2012 Жалоба Поделиться Опубликовано 24 июля, 2012 Категории работают, но изображения нормально не показываются.Как сделать? Я так понимаю есть конфликт.И можно ли добавить + там, где есть подкатегории? (чтобы было видно что есть вложения) Цитата Ссылка на сообщение Поделиться на другие сайты
Prote1n Опубликовано 14 января, 2013 Жалоба Поделиться Опубликовано 14 января, 2013 Не пойму как сделать что бы картинки норм открывались всплывающим окном? Цитата Ссылка на сообщение Поделиться на другие сайты
Prote1n Опубликовано 14 января, 2013 Жалоба Поделиться Опубликовано 14 января, 2013 Разобрался Цитата Ссылка на сообщение Поделиться на другие сайты
gunner Опубликовано 12 марта, 2013 Жалоба Поделиться Опубликовано 12 марта, 2013 подскажите пожалуйста, что надо подправить в этом коде, что бы при клике на категорию работало и раскрытие "аккордеон" и выводился список подкатегорий (так же, как в обычном меню реализовано) Цитата Ссылка на сообщение Поделиться на другие сайты
Sedor Опубликовано 16 марта, 2013 Жалоба Поделиться Опубликовано 16 марта, 2013 Спасибо! Поставил все работает, но вот только действительно до 3 подкатегории, если добавить еще одну, то остальные в этой же категории становятся не активны! Не подскажете что дописать чтобы исправить это? Цитата Ссылка на сообщение Поделиться на другие сайты
Prote1n Опубликовано 30 октября, 2013 Жалоба Поделиться Опубликовано 30 октября, 2013 <script language="javascript" type="text/javascript"> $(document).ready(function() { initMenu('.categories ul'); function initMenu(id) { $(id + ' ul').hide().parent().addClass('subcat'); if($(id).find('a.selected')) { $(id).find('a.selected').addClass('selected').parents('ul').show().parents('li').show(); } else $(id + ' ul:first').show(); $(id + ' a').click( function() { checkElement = $(this).next(); if(checkElement.is('ul')) { if(!checkElement.is(':visible')) { // $(id + ' ul:visible').slideUp('slow'); checkElement.slideDown('slow'); } else checkElement.slideUp('slow'); return false; } }); }}) </script> Как сделать чтобы главная категория была активна, сейчас у меня при нажатии на категорию открываются под категории, но на главную зайти не могу? Цитата Ссылка на сообщение Поделиться на другие сайты
worldElectronics Опубликовано 17 марта, 2015 Жалоба Поделиться Опубликовано 17 марта, 2015 Моё Решение (С огромной помощью igoryk):1. Скрипт перед </head>: {literal} <script type="text/javascript" src="js/jquery/jquery.js"></script> <script langugage="javascript" type="text/javascript"> $(document).ready(function() { initMenu('.categories ul'); function initMenu(id) { $(id + ' ul').hide().parent().addClass('subcat'); if($(id).find('a.selected')) { $(id).find('a.selected').addClass('selected').parents('ul').show().parents('li').show(); } else $(id + ' ul:first').show(); $(id + ' a').click( function() { checkElement = $(this).next(); if(checkElement.is('ul')) { if(!checkElement.is(':visible')) { // $(id + ' ul:visible').slideUp('normal'); checkElement.slideDown('normal'); } else checkElement.slideUp('normal'); return false; } }); }}) </script> {/literal}2. Меняем рекурсивный вывод категорий (если у кого не такой) на: <!-- Меню каталога --> {* Рекурсивная функция вывода дерева категорий *} <div class=categories> {function name=categories_tree} {if $categories} <ul> {foreach $categories as $c} {* Показываем только видимые категории *} {if $c->visible} <li> {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}</a> {categories_tree categories=$c->subcategories} </li> {/if} {/foreach} </ul> {/if} {/function} {categories_tree categories=$categories} </div> <!-- Меню каталога (The End)-->3. Меняем в style.css (и настраиваем под Себя): /* @group Меню каталога*/ .categories ul, .categories li { padding-top: 5px; margin: 0; list-style: none; background: none; } .categories a { color: #000033; padding: 5px 5px 5px 10px; border-bottom: solid 1px #fff; text-decoration: none; display: block; font: 18px Tahoma, Arial; } .categories a:hover { text-decoration: underline; background: #eb540d; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; color: #fff; } .categories ul ul a:hover { text-decoration: none; } .categories ul ul { margin-right: 3px; background: #f9f9f8; -moz-border-radius: 8px; -webkit-border-radius: 8px; border-radius: 8px; padding: 2px 0 6px 14px; } .categories li.subcat { background: none; } .categories ul ul li { margin-right: 3px; margin-bottom: 1px; background: none; } .categories ul ul a { color: #34627b; text-decoration: underline; font: 14px Tahoma, Arial; border: none; } .categories ul li a.selected { color: #eb540d; text-decoration: underline; font: 18px Tahoma, Arial; border: none; } .categories ul ul li a.selected { font-weight: bold; color: #eb540d; font-size: 14px; } .categories ul ul ul li a.selected { font-weight: bold; color: #eb540d; font-size: 14px; } /* @end — Меню каталога*/Поставилось и работает корректно, но картинки категории ставятся над категорией, а хотелось бы с левого края названияПо принципу" Картинка- категория",а сейчас:Картинкакатегория Цитата Ссылка на сообщение Поделиться на другие сайты
borsan Опубликовано 25 марта, 2015 Жалоба Поделиться Опубликовано 25 марта, 2015 можно ли данное меню сделать без отступов с лева ...то есть я вставил в шаблон в поля табле ..... у ТР стоит ширина 200 пикселей..но ...меню имеет отступ от правой стороны... можно ли как то ...сделать его чтоб он не отступал ..а прижался к краю. Цитата Ссылка на сообщение Поделиться на другие сайты
borsan Опубликовано 25 марта, 2015 Жалоба Поделиться Опубликовано 25 марта, 2015 все ...разобрался...вставил margin:0px;padding:0; Цитата Ссылка на сообщение Поделиться на другие сайты
-=NICROSS=- Опубликовано 7 июня, 2017 Жалоба Поделиться Опубликовано 7 июня, 2017 Моё Решение (С огромной помощью igoryk):1. Скрипт перед </head>: {literal} <script type="text/javascript" src="js/jquery/jquery.js"></script> <script langugage="javascript" type="text/javascript"> $(document).ready(function() { initMenu('.categories ul'); function initMenu(id) { $(id + ' ul').hide().parent().addClass('subcat'); if($(id).find('a.selected')) { $(id).find('a.selected').addClass('selected').parents('ul').show().parents('li').show(); } else $(id + ' ul:first').show(); $(id + ' a').click( function() { checkElement = $(this).next(); if(checkElement.is('ul')) { if(!checkElement.is(':visible')) { // $(id + ' ul:visible').slideUp('normal'); checkElement.slideDown('normal'); } else checkElement.slideUp('normal'); return false; } }); }}) </script> {/literal}2. Меняем рекурсивный вывод категорий (если у кого не такой) на: <!-- Меню каталога --> {* Рекурсивная функция вывода дерева категорий *} <div class=categories> {function name=categories_tree} {if $categories} <ul> {foreach $categories as $c} {* Показываем только видимые категории *} {if $c->visible} <li> {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}</a> {categories_tree categories=$c->subcategories} </li> {/if} {/foreach} </ul> {/if} {/function} {categories_tree categories=$categories} </div> <!-- Меню каталога (The End)-->3. Меняем в style.css (и настраиваем под Себя): /* @group Меню каталога*/ .categories ul, .categories li { padding-top: 5px; margin: 0; list-style: none; background: none; } .categories a { color: #000033; padding: 5px 5px 5px 10px; border-bottom: solid 1px #fff; text-decoration: none; display: block; font: 18px Tahoma, Arial; } .categories a:hover { text-decoration: underline; background: #eb540d; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; color: #fff; } .categories ul ul a:hover { text-decoration: none; } .categories ul ul { margin-right: 3px; background: #f9f9f8; -moz-border-radius: 8px; -webkit-border-radius: 8px; border-radius: 8px; padding: 2px 0 6px 14px; } .categories li.subcat { background: none; } .categories ul ul li { margin-right: 3px; margin-bottom: 1px; background: none; } .categories ul ul a { color: #34627b; text-decoration: underline; font: 14px Tahoma, Arial; border: none; } .categories ul li a.selected { color: #eb540d; text-decoration: underline; font: 18px Tahoma, Arial; border: none; } .categories ul ul li a.selected { font-weight: bold; color: #eb540d; font-size: 14px; } .categories ul ul ul li a.selected { font-weight: bold; color: #eb540d; font-size: 14px; } /* @end — Меню каталога*/ А кто может подсказать, как к данному решению прикрутить сохранение активной вкладки при обновлении страницыбудь то cookie или localStorage? Цитата Ссылка на сообщение Поделиться на другие сайты
Рекомендуемые сообщения
Присоединяйтесь к обсуждению
Вы можете написать сейчас и зарегистрироваться позже. Если у вас есть аккаунт, авторизуйтесь, чтобы опубликовать от имени своего аккаунта.