YouTube (www.youtube.com/friedpanseller) のようなナビゲーション セクションがホーム、ビデオ、概要、ディスカッションに必要です。それらを強調表示するかクリックすると、赤いバーが表示されます。その赤いバーを表示するにはどうすればよいですか。
質問する
140 次
1 に答える
1
この例を使用して問題を説明します
アクティブなアイテムの状態を維持したい場合は、すべての html ファイルに navbar レイアウトを含める必要があります。たとえば、[Research] をクリックした場合、research.html のナビゲーション バーは次のようになっている必要があります。
<div class="navbar">
<div class="navbar-fixed-top">
<div class="container" style="width: auto;">
<div class="nav-collapse" id="nav-collapse">
<ul class="nav" id="nav">
<li ><a href="#skdill" >skisll</a></li>
<li ><a href="#skill">skill</a></li>
<li class="active"><a href="#research">research</a></li>
<li ><a href="#">Link</a></li>
</ul>
</div>
</div>
</div>
And so on for all your links.
EDIT You can use JavaScript and do the trick:
<!DOCTYPE html>
<html>
<head>
<script src="js/jquery.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<link href="css/bootstrap.min.css" rel="stylesheet" media="screen">
<link href="css/bootstrap-responsive.min.css" rel="stylesheet">
</style>
</head>
<script>
$(function() {
$('#nav li a').click(function() {
$('#nav li').removeClass();
$($(this).attr('href')).addClass('active');
});
});
</script>
<body>
<div class="navbar">
<div class="navbar-fixed-top">
<div class="container" style="width: auto;">
<div class="nav-collapse" id="nav-collapse">
<ul class="nav" id="nav">
<li id="home"><a href="#home">Home</a></li>
<li id="skill"><a href="#skill">Skill</a></li>
<li id="research"><a href="#research">Research</a></li>
<li id="link"><a href="#link">Link</a></li>
</ul>
</div>
</div>
</div>
</div>
</body>
</html>
于 2013-10-15T04:31:46.333 に答える