1
的圖像隱藏我做一個代碼在頂部位置貼導航欄時，我向下滾動。但現在的問題是，當我向下滾動固定在頂部的集合，因爲我的代碼。但是隱藏導航欄的導航欄後面的圖片。當我向上滾動，導航欄必須堅持在頂部位置，不按照導航欄
前SCROLLING
後滾動 
讓我們來看看我的代碼
<div class="container">
<h1>Mohamed faisal</h1>
<p>Welcome to home page</p>
</div>
<div class="row" id="rows" >
<div class="col-md-2 home" align="center" >Home</div>
<div class="col-md-2 about" align="center">Department</div>
<div class="col-md-2 home" align="center">Applications</div>
<div class="col-md-2 about" align="center">Technologies</div>
<div class="col-md-2 home" align="center">About us</div>
<div class="col-md-2 about" align="center">Help</div>
</div>
<div class="container">
<br>
<div id="myCarousel" class="carousel slide" data-ride="carousel">
<!-- Indicators -->
<ol class="carousel-indicators">
<li data-target="#myCarousel" data-slide-to="0" class="active"></li>
<li data-target="#myCarousel" data-slide-to="1"></li>
<li data-target="#myCarousel" data-slide-to="2"></li>
<li data-target="#myCarousel" data-slide-to="3"></li>
</ol>
<!-- Wrapper for slides -->
<div class="carousel-inner" role="listbox">
<div class="item active">
<img src="f1.jpg" alt="Chania" width="460" height="345">
<div class="carousel-caption">
<h3>Chania</h3>
<p>The atmosphere in Chania has a touch of Florence and Venice.</p>
</div>
</div>
<div class="item">
<img src="f2.jpg" alt="Chania" width="460" height="345">
<div class="carousel-caption">
<h3>Chania</h3>
<p>The atmosphere in Chania has a touch of Florence and Venice.</p>
</div>
</div>
<div class="item">
<img src="f3.jpg" alt="Flower" width="460" height="345">
<div class="carousel-caption">
<h3>Flowers</h3>
<p>Beatiful flowers in Kolymbari, Crete.</p>
</div>
</div>
<div class="item">
<img src="f4.jpg" alt="Flower" width="460" height="345">
<div class="carousel-caption">
<h3>Flowers</h3>
<p>Beatiful flowers in Kolymbari, Crete.</p>
</div>
</div>
</div>
$("document").ready(function ($) {
var offsets = document.getElementById('rows').getBoundingClientRect();
var topoffsets = offsets.top;
$(window).bind('scroll', function() {
if ($(window).scrollTop() > topoffsets) {
$("#rows").css({ top: 0, position: 'fixed' });
} else {
$("#rows").css({ top: '', position: '' });
}
});
});
謝謝@wmeade，我得到的輸出。你能告訴我有關的z-index？..謝謝 – user3075386
'Z-index'控制頁面中的項目的堆疊（或分層）。鬆散地想像一堆紙。最頂端的紙張在堆棧上具有高'的z index'，而下部片材具有較低的'的z index'。所以'z-index'越低，它將堆疊的「越遠」。通過導覽列設置爲'99999'，你告訴它，以顯示一切在頁面上的其他人之上。現在，您不必使用如此之高的數字，這只是確保它會覆蓋頁面上的任何其他z-索引屬性。 – wmeade