我使用的是一個網站的引導程序,我正在嘗試創建一個div,它將位於未滾動的網站上的導航欄上方,但是當我開始滾動時它將消失和導航欄將填補現場。堆棧上滾動的隱藏導航欄的div ontop
我有它的 「工作」 用這樣的:
HTML
<div class="container">
<div class="row">
<div class="hidden-xs col-md-offset-8 col-sm-offset-8" style="padding:2px 0 3px 0;">
<span class="btcall">Call for a free quote call - <span class="badge"><i class="glyphicon glyphicon-earphone"></i> 1300 123 456</span>
</div>
</div>
</div>
<nav class="navbar navbar-default navbar-fixed-top topnav" role="navigation">
etc etc
的JavaScript
$(window).scroll(function() {
if ($(document).scrollTop() > 50) {
$('nav').addClass('shrink');
} else {
$('nav').removeClass('shrink');
}
});
CSS
.navbar-fixed-top {
top:25px;
}
nav a {
padding-top: 20px !important;
padding-bottom: 20px !important;
font-size: 16px;
}
nav .navbar-toggle {
margin: 13px 15px 13px 0;
}
.navbar-brand {
font-size: 30px !important;
margin-top:-15px;
}
.navbar-fixed-top.shrink {
top:0px;
}
nav.navbar.shrink {
min-height: 35px;
}
nav.shrink a {
padding-top: 15px !important;
padding-bottom: 10px !important;
font-size: 14px;
}
nav.shrink .navbar-brand {
font-size: 20px !important;
margin-top:0;
}
這不是很理想,我覺得它可以做得更聰明,但我是n確信如何。基本上我很喜歡它被固定到導航,並隱藏在滾動而不是卡住的地方,只有當瀏覽器將它滾動到頂部時纔會出現。
你不喜歡那你當前的腳本?你介意進一步解釋一下嗎? – seanlevan 2015-02-11 06:31:31
你能爲此創建一個小提琴嗎? – 2015-02-11 06:43:24