pasti teman-teman sudah tidak asing lagi dengan sticky menu dimana terdapat sebuah menu yang tetapi di atas walaupun kita scroll kebawah, sekarang CSS sudah menyediakan yang namanya position sticky dimana menu akan tetap di atas, dan bisa juga kita menggunakan position fixed, tetapi disini kita akan membuat menu fixed nya menggunkan javascript.

Jadi walaupun kita bisa menggunakan position sticky dan position fixed tapi saya akan mencobanya menggunakan sebuah javascript, caranya seperti apa, begini di dalam javascript terdapat sebuah fungsi javascript yaitu window.onscroll jadi fungsi ini untuk melihat kita seberapa banyak kita menscrollnya, dan nanti kita hitung, jadi ketika scroll sebanyak 50 menu akan langsung tampil dan jika menu itu akan kita sembunyikan.

Disini saya jadi membuat menu 2 ya, dimana yang satu untuk contoh saat kita scroll yang satu saat berada tetap di atas, Kurang lebih seperti itu, oke langsung saja disini struktur HTMLnya seperti ini saja.

Jika sudah disini terdapat dua menu, yang satu navbar yaitu menu tampil saat scroll dan yang satu yang berada tetap di atas, oke untuk CSSnya seperti ini

dan yang terakhir Javascriptnya

Oke sekarang kita lihat hasilnya:

Cara Membuat Menu Fixed Top Saat Scroll Down Cara Membuat Menu Fixed Top Saat Scroll Down

bisa dilihat yang pertama adalah tampilan awal sebelum di scroll dan yang kedua adalah setelah di scroll, oke saya rasa cukup sampai disni belajar kita tentang cara membuat menu fixed top saat scroll down, semoga bermanfaat dan sampai jumpa pada artikel selanjutnya terimakasih.