Joomla Bootstrap导航栏不能在3级潜艇上工作

时间:2014-04-20 19:19:09

标签: jquery twitter-bootstrap joomla joomla3.2

我会尽量让这篇文章尽可能简短,以便找到一些不起作用的例子,导航到http://zink.development.webdesign-toledo.com

现在我遇到的问题是我有两个菜单几乎一直在工作。第一个是主菜单,第二个是产品菜单。主菜单配置为产品菜单的菜单项别名。我这样做了,以便在不使用导航栏的不同模块中显示菜单时分配活动类。因此......当使用导航栏将主菜单导航到第三级菜单项时,菜单中断并尝试切换下拉菜单,它只是在URL的末尾添加#并且不会切换打开或关闭。我把它缩小到仅在第三级菜单项时出现的问题。不知道最近发生了什么,但我真的需要让它发挥作用。

模板代码:

<?php if($this->countModules('main-menu')) : ?>
<div id="main-menu" class="row-fluid">    
    <div class="navbar">
        <div class="navbar-inner">
            <div class="container">
                <a class="btn btn-navbar" data-toggle="collapse" data-target=".main-menu">
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                    <span class="icon-bar"></span>
                </a>
                <?php if(!empty($logo)): ?>
                    <a class="brand" href="<?php echo $this->baseurl; ?>/"><img src="/<?= $logo ?>" /></a>
                <?php else: ?>
                    <a class="brand" href="<?php echo $this->baseurl; ?>/"><?= $title ?></a>
                <?php endif; ?>
                <div class="main-menu nav-collapse collapse">
                    <jdoc:include type="modules" name="main-menu" style="none"/>
                </div>
            </div>
        </div>
    </div>
</div>
<?php endif; ?>

的Javascript / Jquery的:

(function($){
  jQuery(document).ready(function(){
    $('.navbar .parent').addClass('dropdown');
    $('.navbar .parent > a').addClass('dropdown-toggle');
    $('.navbar .parent > a').attr('data-toggle', 'dropdown');
    $('.navbar .parent > a').attr('href','#');
    $('.navbar .parent > a').append('<span class="caret"></span>');
    $('.navbar .parent > ul').addClass('dropdown-menu');
    $('.navbar .nav-child .parent').removeClass('dropdown');
    $('.navbar .nav-child .parent .caret').css('display', 'none');
    $('.navbar .nav-child .parent').addClass('dropdown-submenu');
  });
})(jQuery);

我注意到joomla菜单模块添加了类属性alias-parent-active。我想了一会儿这就是问题所在,但禁用此功能并没有效果。

我已经盯着这几天试图找出来,所以希望有人可以帮助我。

1 个答案:

答案 0 :(得分:0)

问题是你在另一个下拉机制中使用一个下拉机制(以相同的方式工作) 你需要亲自动手才能完成这项工作 首先,你的子菜单是在悬停时显示的(这不是你所知道的),而不是点击打开(删除负责该操作的CSS规则)。
如果菜单仍然不能正常工作,那么请使用jQuery click method进行 .dropdown-submenu .dropdown-toggle 类。内部方法类型如下:

e.preventDefault();
$(this).closest('.dropdown-submenu').children('.dropdown-menu').toggleClass('opened');

将CSS添加到这样的内容:

.dropdown-menu.opened {display: block;}