Joomla:如何在浏览单独的子菜单项时突出显示主菜单项?

时间:2011-06-24 04:14:57

标签: menu joomla menuitem menubar joomla1.6

我正在尝试制作一个水平的“类别”主菜单和一个与主要菜单分开的垂直子菜单。当我选择一个类别时,会显示其主页面。但是当我从子菜单中选择另一个页面时,它应该来自同一类别,那么主菜单中的“类别”项目将停止突出显示。所有菜单都被定义为“独立”模块,我正在使用Joomla 1.6.3。

2 个答案:

答案 0 :(得分:3)

任何类型的突出显示或效果都基于CSS类,这些CSS类是在通过XML创建菜单时分配的。如果您将每个菜单分开而不是一个大型层次结构,则可能会遇到问题。您的菜单结构应该使用层次结构在一个模块中完成。

如果我们看看Joomla 1.6演示页面:hhttp://demo16.cloudaccess.net/index.php/using-joomla/extensions我们可以看到“使用Joomla!”是父母,“使用扩展是孩子”。让我们看看为每个链接分配给

  • 的CSS类

    使用Joomla - class =“active deep parent” 使用扩展 - class =“当前活跃的更深的父级”

    然后,您可以根据

    等层次结构使用CSS Javascript控制格式
     li.parent li.current { CSS here } //do things based on the current
     li.active li.active { css here } // add an .active for each level down the hierarchy, for example to affect 3 ways in, require three li.actives in the hierarchical-selector  
    

    例如,这里有一些在该页面上使用的CSS规则:

    ul.menu li.active a:link, ul.menu li.active a:visited { 
        color: #333333;
    }
    
    ul.menu li.active ul li.active a:link, ul.menu li.active ul li.active a:visited { 
         border-bottom-color: #ffffff;
         border-bottom-style: solid;
         border-bottom-width: 1px;
         border-left-color: currentColor;
         border-left-style: none;
         border-left-width: 0px;
         border-right-color: currentColor;
         border-right-style: none;
         border-right-width: 0px;
         border-top-color: currentColor;
         border-top-style: none;
         border-top-width: 0px;
         color: #333333;
     }
    

    如果你没有为一切使用一个大的菜单,那么父项将没有添加正确的CSS类,你将不得不做更复杂的javascript。

  • 答案 1 :(得分:3)

    我当时不知道的是我应该将顶部菜单中的每个项目设置为菜单项别名。这允许我在从子菜单中选择项目时保持项目突出显示。

    根据Joomla文档http://docs.joomla.org/Help16:Menus_Menu_Item_Manager_Edit#Menu_Item_Alias

      

    “此菜单项类型创建指向现有菜单项的链接。它允许   您可以在两个或多个不同的菜单上使用相同的菜单项   没有重复设置。因此,例如,如果您更改了   具有与其链接的别名的菜单项的参数,即别名   将自动获得相同的更改。“

    对于那些像我之前一样苦苦思索Joomla菜单的人 - 这种配置的主菜单位于“模块菜单”中,开始和结束级别设置为1(基本选项),子菜单位于不同的“模块”中,但带有相同的菜单,但是从第2级开始。