Question

有人能在这里发现问题吗？我的手机nav无效。按钮显示正常，但单击它时没有任何反应。

非常感谢任何帮助

<!-- Header ================================================== --> 
<header class="site-header" role="banner">

    <!-- Section 1: NAV ================================================== --> 
    <div class="navbar navbar-default navbar-fixed-top">
        <div id="top-bar" class="container-fluid nav-container">
            <div>
                <div>
                    <span style="padding: 25px">Open 10:30am till late   |  Tel: +353 (0)XXXXXXXXXXX</span>
                    <img src="<?php bloginfo('stylesheet_directory'); ?>/assets/img/social-icons.png">
                </div>
            </div>
        </div>  
        <div class="navbar-header">
            <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
                <span class="sr-only">Toggle navigation</span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </button>
        </div>
        <a class="navbar-brand" href="#"> 
            <img src="<?php bloginfo('stylesheet_directory'); ?>/assets/img/logo.png">
        </a> 
        <!--logo -->
        <div id="navbar" class="navbar-collapse collapse">
            <ul class="nav navbar-nav">
                <li><a href="#!">Menus</a></li>
                <li><a href="/mcs/host-your-party/">Host your party!</a></li>
                <li><a href="/mcs/#events">Events</a></li>
                <li><a href="#offers">Offers</a></li>
                <li><a href="#gallery">Gallery</a></li>
                <li><a href="#!">Contact</a></li>
            </ul>
        </div>
        <!--/.nav-collapse -->
    </div>
</header>

Answer 1

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" type="text/javascript"></script>

<div class="navbar navbar-default navbar-fixed-top">

        <div id="top-bar" class="container-fluid nav-container">

            <div>

                <div><span style="padding: 25px">Open 10:30am till late   |  Tel: +353 (0)1 497 9775</span>

                        <img src="<?php bloginfo('stylesheet_directory'); ?>/assets/img/social-icons.png">

                </div>

            </div>

        </div>  

        <div class="navbar-header">

          <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
            <span class="sr-only">Toggle navigation</span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
          </button>
        </div>

        <a class="navbar-brand" href="#"> <img src="<?php bloginfo('stylesheet_directory'); ?>/assets/img/logo.png"></a> <!--logo -->



       <div id="navbar" class="navbar-collapse collapse">


            <ul class="nav navbar-nav">
                <li><a href="#!">Menus</a></li>
                <li><a href="/mcs/host-your-party/">Host your party!</a></li>
                <li><a href="/mcs/#events">Events</a></li>
                <li><a href="#offers">Offers</a></li>
                <li><a href="#gallery">Gallery</a></li>
                <li><a href="#!">Contact</a></li>
            </ul>

        </div><!--/.nav-collapse -->

    </div>

Mobile Nav无法正常工作

1 个答案: