Умное меню
В продолжении выпадающего меню. Учим меню понимать вложенность.
Создаем файл к примеру: menu_li.tpl.html с содержимым:{* шаблон блока развернутого дерева категорий *} {if $big_categories_tree && $big_categories_tree_count>0} {assign var="oldnumber" value=0} [list] {section name=h loop=$big_categories_tree} {if $big_categories_tree[h].categoryID != 1} {if $big_categories_tree[h.index].level lt $big_categories_tree[h.index_next].level}{* вывод категорий *} [*][url="{if%20$smarty.const.CONF_MOD_REWRITE%20eq%201}category_{$big_categories_tree[h].categoryID}.html{else}index.php?categoryID={$big_categories_tree[h].categoryID}{/if}"]{$big_categories_tree[h].name}[/url] [list] {else} {* вывод подкатегорий или категорий без вложенности *} [*][url="{if%20$smarty.const.CONF_MOD_REWRITE%20eq%201}category_{$big_categories_tree[h].categoryID}.html{else}index.php?categoryID={$big_categories_tree[h].categoryID}{/if}"]{$big_categories_tree[h].name}[/url] {/if} {if $big_categories_tree[h.index].level gt $big_categories_tree[h.index_next].level} [/list] {/if} {/if} {/section} [/list] {else} {$smarty.const.STRING_NO_CATEGORIES} {/if}
Кладем в core/tpl/user/blocks/ваш шаблон, и подключаем его из админки.
создаем отдельный файл css. Как подключать знаете... В нем:.suckerdiv ul{ margin: 0; padding: 0; list-style-type: none; width: 220px; /* Width of Menu Items */ border-bottom:; } .suckerdiv ul li{ position: relative; } /*Sub level menu items */ .suckerdiv ul li ul{ background: #cccccc; position: absolute; width: 220px; /*sub menu width*/ top: 0; } /* Sub level menu links style */ .suckerdiv ul li a{ display: block; overflow: auto; /*force hasLayout in IE7 */ color: black; text-decoration: none; text-align: left; background: #cccccc; padding: 3px 10px 3px 5px; border: 1px solid #fff; border-bottom: 0; } .suckerdiv ul li a:visited{ color: black; } .suckerdiv ul li a:hover{ background-color: yellow; text-decoration: none; } .suckerdiv .subfolderstyle{ background: url(ваша картинка.gif) no-repeat center right; } /* Holly Hack for IE \*/ * html .suckerdiv ul li { float: left; height: 1%; } * html .suckerdiv ul li a { height: 1%; } /* End */
Файл изображения (сами рисуете, желательно 5px Х 5px) кладем в data/ваш шаблон
Далее создаем файл ваше_имя.js, и кладем его также в data/ваш шаблон (соответственно также подключаем его), с содержимым:var menuids=["suckertree1"] //Enter id(s) of SuckerTree UL menus, separated by commas function buildsubmenus(){ for (var i=0; i var ultags=document.getElementById(menuids[i]).getElementsByTagName("ul") for (var t=0; t ultags[t].parentNode.getElementsByTagName("a")[0].className="subfolderstyle" if (ultags[t].parentNode.parentNode.id==menuids[i]) //if this is a first level submenu ultags[t].style.left=ultags[t].parentNode.offsetWidth+"px" //dynamically position first level submenus to be width of main menu item else //else if this is a sub level submenu (ul) ultags[t].style.left=ultags[t-1].getElementsByTagName("a")[0].offsetWidth+"px" //position menu to the right of menu item that activated it ultags[t].parentNode.onmouseover=function(){ this.getElementsByTagName("ul")[0].style.display="block" } ultags[t].parentNode.onmouseout=function(){ this.getElementsByTagName("ul")[0].style.display="none" } } for (var t=ultags.length-1; t>-1; t--){ //loop through all sub menus again, and use "display:none" to hide menus (to prevent possible page scrollbars ultags[t].style.visibility="visible" ultags[t].style.display="none" } } } if (window.addEventListener) window.addEventListener("load", buildsubmenus, false) else if (window.attachEvent) window.attachEvent("onload", buildsubmenus)
Вот и все, теперь пользователь видит где есть вложенные категории, и где нет их.
Странно но все равно ничего не выходит.