Question

我正在使用materializecss框架在djangocms中创建导航。我无法获得功能，因此下拉列表和可折叠工作正常。现在下拉列表只显示一个子菜单，而折叠不起作用，所以我把它搁置。以下是我的menu.html代码：

{% load i18n menu_tags cache %}
{% for child in children %}
<li class="child{% if child.selected %} active{% endif %}
{% if child.children %} dropdown{% endif %}">
{% if child.children %}
<a href="#" class="dropdown-button" data-activates="dropdown3">{{ child.get_menu_title }}
    <i class="material-icons right">arrow_drop_down</i></a>
<ul class="dropdown-content">
    {% show_menu from_level to_level extra_inactive extra_active template "" "" child %}
</ul>
{% else %}
   <a href="{{ child.attr.redirect_url|default:child.get_absolute_url }}">{{ child.get_menu_title }}</a>
{% endif %}
</li>
{% if class and forloop.last and not forloop.parentloop %}{% endif %}
{% endfor %}

以下是我在menu.html上的base.html调用：

<ul id="dropdown3" class="dropdown-content">
{% show_sub_menu 1  %}
</ul>
<nav>
<div class="nav-wrapper">
 <a href="#!" class="brand-logo">Logo</a>
 <ul class="right hide-on-med-and-down">
     {% show_menu 0 100 100 100 "menu.html" %}
 </ul>
</div>
</nav>

我需要完成的下拉功能如下所示，但我希望它完成，所以我不必担心ID：

我发布了链接，因为它也显示了功能，但这里是代码：

<!-- Dropdown Structure -->
<ul id="dropdown1" class="dropdown-content">
  <li><a href="#!">one</a></li>
  <li><a href="#!">two</a></li>
  <li class="divider"></li>
  <li><a href="#!">three</a></li>
</ul>
<nav>
 <div class="nav-wrapper">
  <a href="#!" class="brand-logo">Logo</a>
  <ul class="right hide-on-med-and-down">
   <li><a href="sass.html">Sass</a></li>
   <li><a href="badges.html">Components</a></li>
   <!-- Dropdown Trigger -->
   <li><a class="dropdown-button" href="#!" data-activates="dropdown1">Dropdown<i class="material-icons right">arrow_drop_down</i></a></li>
 </ul>
</div>
</nav>

Materialisecss与django cms为一个网站

0 个答案: