BootStrap ASP Navbar切换不起作用

时间:2014-02-04 05:43:31

标签: jquery asp.net twitter-bootstrap drop-down-menu navbar

我正在尝试使用ASP.net创建一个响应式导航栏,但是在调整网站大小时弹出的下拉列表或导航栏按钮都没有正常工作。

以下是母版页的asp代码:

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<link rel="shortcut icon" type="image/x-icon" href="img/icon2.png" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- Bootstrap -->
<link href="css/bootstrap.css" rel="stylesheet">
<link href="css/styles.css" rel="stylesheet">
<asp:ContentPlaceHolder id="head" runat="server">
</asp:ContentPlaceHolder>
</head>
<body>
<form id="form1" runat="server">
<div>
    <nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">


    <div class="container">
      <asp:LinkButton ID="lbHome" CssClass="navbar-brand" href="index.aspx" runat="server" ><span class="glyphicon glyphicon-home"></span> Delta Sigma Pi</asp:LinkButton>

        <asp:LinkButton ID="LinkButton1" cssclass="navbar-toggle" runat="server" data-toggle="collapse" data-target=".navHeaderCollapse"><span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span></asp:LinkButton>



      <div class="collapse navbar-collapse navHeaderCollapse">

        <ul class="nav navbar-nav navbar-right">
            <li><asp:LinkButton ID="lbAbout" href="about.aspx" runat="server">About</asp:LinkButton></li>
            <li class="dropdown">
                <asp:LinkButton ID="lbRecruitmentInstructions" CssClass="dropdown-toggle" runat="server">Recruitment</asp:LinkButton>
                    <ul class="dropdown-menu">
                        <li><asp:LinkButton ID="lbSVPLetter" href="SVPLetter.aspx" runat="server">Letter from the SVP</asp:LinkButton></li>
                        <li class="divider"></li>
                        <li><a href="RecruitmentInstructions.aspx">Instructions</a></li>
                        <li><a href="RecruitmentEvents.aspx">Events</a></li>
                        <li><a href="RecruitmentFAQ.aspx">FAQ</a></li>
                    </ul>
            </li>
            <li class="disabled"><a href="">Pledges</a></li>
            <li class="disabled"><a href="">Brothers</a></li>

            <li><a href="Contact.aspx">Contact</a></li>

            <li><a href="signin.aspx" ><span class="glyphicon glyphicon-user"></span> Sign In</a></li>
        </ul>
      </div>
    </div>
    </nav>

    <asp:ContentPlaceHolder id="ContentPlaceHolder1" runat="server">

    </asp:ContentPlaceHolder>

    <br /><br />
    <div style="position: relative; bottom: 0; left: 0; width: 100%" class="navbar navbar-default navbar-static-bottom">
        <div class="container">
            <p class="navbar-text"> </p>
        </div>
    </div>



</div>
</form>

<script type="text/javascript" src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
<script type="text/javascript" src="js/bootstrap.min.js"></script>
<script>$(document).ready(function () { $('#main-content').fadeIn(2500); });</script>

0 个答案:

没有答案