▲
1
Mau Tanya Cara Show and Hide Navbar Scroll using Bootstrap
17/5/2020400 viewsoleh: Rizky_1453 _
csshtmlbootstap
<script>
// Scrolling Effect
$(window).on("scroll", function() {
if($(window).scrollTop()) {
$('nav').addClass('black');
}
else {
$('nav').removeClass('black');
}
});
</script>1 Jawaban
▲
2
▼
Ini salah kondisi if nya saja sih seharusnya.
Eventnya sudah bener onscroll. Pertanyaannya pas di scroll mau dicek apanya? Umumnya ya di cek adalah posisi sekarang itu sudah sama gak sama posisi yang diinginkan.
Saya kasih contoh pakai vanilla ya:
var prevScrollpos = window.pageYOffset;
// Attach onscroll event
window.onscroll = function() {
var currentScrollPos = window.pageYOffset;
if (prevScrollpos > currentScrollPos) {
document.getElementById("navbar").style.top = "0";
} else {
document.getElementById("navbar").style.top = "-50px";
}
prevScrollpos = currentScrollPos;
}
Kode ini saya ambil dari tautan https://www.w3schools.com/howto/howto_js_navbar_hide_scroll.asp, jadi silahkan mampir dan baca kalau memang dibutuhkan.
Semoga menjawab pertanyaannya.
Salam, @mazipan
Login dulu untuk memberikan jawaban.
