基金会顶级酒吧问题

Question

我刚刚从前任同事处选择了一个项目，我在基金会顶部酒吧遇到了一些问题。

在移动设备上查看网页时，菜单已经显示，当您按下“汉堡包”/菜单图标时，它会应用扩展的类，就好像它应该只在那时开始显示一样。

我查看了基础文档，HTML结构似乎是正确的。

有没有人遇到类似的问题？

您可以在此处查看网页：beta.drumshop.co.uk

谢谢，

罗布

编辑：标题代码：

    <div class="row">

        <nav class="top-bar">

            <ul class="title-area">

                <li class="logo"><a href="{% url home %}"><img src="{{MEDIA_URL}}img/home/ds-logo.png" alt="Drumshop Logo"></a></li>

                    <!-- Remove the class "menu-icon" to get rid of menu icon. Take out "Menu" to just have icon alone -->
                <li class="toggle-topbar menu-icon"><a href="#"><span>Menu</span></a></li>

            </ul>

            <section class="top-bar-section">

                <!-- Left Nav Section -->
                    <ul class="left">

                        {% block nav_main %}
                        {% get_default_page as default_page %}
                    {% block sale_link %}
                        {% if sale_open %}
                            <li>
                                <a
                                    id="nm_sale"
                                    class="open"
                                    href="{% url sale:sale_list %}">
                                    Sale
                                </a>
                            </li>
                        {% endif %}
                    {% endblock %}
                <li class="has-dropdown">
                    <a
                        id="nm_home"
                        href="{% url shop %}">
                        Shop
                    </a>

                    <ul class="dropdown">

                        {% get_root_categories as root_categories %}
                        {% for o in root_categories %}
                            {% if o.visible %}
                                <li><a id="nl_{{o.slug}}" href="{{o.get_absolute_url}}#drumshop">{{o.title|title}}</a></li>
                            {% endif %}
                        {% endfor %}
                        <li class="brands">
                    <select onchange="if(this.options[this.selectedIndex].value != ''){window.top.location.href=this.options[this.selectedIndex].value}">
                        <option value="" title="choose your brand">Select brand&hellip;</option>
                        {% get_brands as brands %}
                        {% for brand in brands %}
                        <option value="{{brand.get_absolute_url}}#drumshop" title="{{brand.title}}" id="brand{{brand.pk}}">{{brand.title}}</option>
                        {% endfor %}
                    </select>
                </li>

                    </ul>

                </li>
                <li>
                    <a
                        id="nm_events"
                        href="{% url events %}">
                        Clinics &amp; Events 
                    </a>
                </li>
                <li>
                    <a
                        id="nm_blog"
                        href="{% url blog %}">
                        Blog
                    </a>
                </li>
                <li class="has-dropdown">
                    <a
                        id="nm_about"
                        href="/pages/about-drumshop.html">
                        About us
                    </a>

                    <ul class="dropdown">

                        <li>
                            <a href="/pages/about-drumshop/contacting-us.html">
                                Contacting Us
                            </a>

                        </li>

                        <li>
                            <a href="pages/about-drumshop/competition-winners.html">
                                Competition Winners
                            </a>
                        </li>

                        <li>
                            <a href="/pages/pages/about-drumshop/appraisals.html">
                                Appraisals
                            </a>
                        </li>

                        <li>
                            <a href="/pages/about-drumshop/brand-month.html">
                                Product of the Month
                            </a>
                        </li>

                        <li>
                            <a href="/pages/about-drumshop/delivery.html">
                                Delivery Details
                            </a>
                        </li>

                        <li>
                            <a href="/pages/about-drumshop/returns.html">
                                Returns
                            </a>
                        </li>

                        <li>
                            <a href="/pages/about-drumshop/price-beater-drum-shop.html">
                                Price Beater
                            </a>
                        </li>

                        <li>
                            <a href="/pages/about-drumshop/new-drumming.html">
                                New to Drumming
                            </a>
                        </li>

                        <li>
                            <a href="/pages/about-drumshop/interest-free-finance.html">
                                Finance
                            </a>
                        </li>

                        <li>
                            <a href="/pages/about-drumshop/personal-shopping.html">
                                Personal Shopping
                            </a>
                        </li>

                    </ul>

                </li>
                <li>
                    <a
                        id="nm_contact"
                        href="/contact/">
                        Contact
                    </a>
                </li>

                    </ul>

        {% block quick_basket %}
                <!-- Right Nav Section -->

        <ul class="cart_area right">

            {% if request.user.is_authenticated %}

                <a href="{% url accounts_auth_login %}"><li><span class="icon-user"></span>Your Account</li></a>

            {% else %}

                <a href="{% url accounts_auth_login %}"><li><span class="icon-user"></span>Login / Register</li></a>

            {% endif %}

            <a href="{% url ccbasket:basket %}"><li><span class="icon-coin"></span>{{basket.total_items}} Items , £{{basket.total_price}}</li></a>

            <a href="{% url shop_checkout %}"><li><span class="icon-cart"></span>Checkout</li></a>


        </ul>

        {% endblock %}

            </section><!-- end of Header section -->

        </nav><!-- End of header nav -->

    </div><!-- end of header row -->