【发布时间】:2017-10-23 00:55:51
【问题描述】:
我是 bootstrap 的新手,试图切换导航栏,但按钮根本不起作用。我尝试了几个 jQuery 版本,但无济于事。我感到很困惑。另外,我用的是bootstrap.rtl。
这是我的代码:
<head runat="server">
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<link href="Content/bootstrap.min.css" rel="stylesheet" />
<link href="Content/bootstrap-rtl.min.css" rel="stylesheet" />
<link href="Content/main.css" rel="stylesheet" />
<script src="Scripts/jquery-1.9.1.js"></script>
<script src="Scripts/bootstrap.min.js"></script>
<script src="Scripts/bootstrap-rtl.min.js"></script>
</head>
<nav class="navbar navbar-inverse" style="background-color:
#330033">
<div class="container-fluid" style="padding-right: 0px">
<div class="navbar-header">
<button type="button" class="navbar-toggle collapsed"
data-toggle="collapse" data-target="#navbar-collapse-zagros" aria-
controls="zagros">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<%--<a class="navbar-brand" style="padding-left:8px"
href="#">زاگرس تیکتینگ</a>--%>
<div style="background-image: url('Images/logo-
zagros.png'); background-repeat: no-repeat; width: 124px; height: 70px;">
</div>
</div>
<div class="collapse navbar-collapse" id="navbar-collapse-
zagros">
<ul class="nav navbar-nav ">
<li class="active "><a class="text-center" href="#">
<i class="glyphicon glyphicon-dashboard white"></i>
<br />
داشبورد</a></li>
<li><a class="text-center" href="#"><i
class="glyphicon glyphicon-th-large white"></i><br />بخش ها</a></li>
<li><a href="#" class="text-center"><i
class="glyphicon glyphicon-th white"></i><br />کاربران</a></li>
<li><a href="#" class="text-center"><i
class="glyphicon glyphicon-file white"></i><br />تیکت</a></li>
<li><a href="#" class="text-center"><i
class="glyphicon glyphicon-cog white"></i><br />تنظیمات</a></li>
<li class="dropdown"><a class="dropdown-toggle text-
center" data-toggle="dropdown" href="#"><i class="glyphicon glyphicon-
education white"></i><br />پایگاه اطلاعات<span class="caret"></span></a>
<ul class="dropdown-menu">
<li><a href="#">1</a></li>
<li><a href="#">2</a></li>
<li><a href="#">3</a></li>
</ul>
</li>
<li><a id="exit" href="#" class="text-center"><i
id="exitIcon" class="glyphicon glyphicon-off white"></i><br />خروج</a>
</li>
</ul>
<ul class="nav navbar-nav navbar-left">
<li><a href="#" class="text-center" style="padding-
top:23px"><i class="glyphicon glyphicon-log-in white" style="padding-
left: 5px;"></i>ورود</a></li>
<li><a href="#" class="text-center" style="padding-
top:23px"><i class="glyphicon glyphicon-user white" style="padding-
left: 5px;"></i>ثبت نام</a></li>
</ul>
</div>
</div>
</nav>
【问题讨论】:
-
您使用的是哪个 bootstrap-rtl 库?是这个吗morteza bootstrap-rtl
-
bootstrap rtl by Mahdi Gherekhloo v3.3.5.2
标签: html twitter-bootstrap toggle collapse