Membuat Sticky Header Hide on Scroll Down dan Show on Scroll Up

Berbeda dengan tutorial sebelumnya yang membuat sticky pada menu yang berada di bawah header, kali ini kita akan memberikan efek show hide pada header yang sudah melayang. Untuk itu saya mencari cara yang hanya menggunakan CSS dan javascript, dan berikut caranya.
Jadi pada situasi awalnya, header sudah melayang dan menempel di sisi atas halaman seperti gambar berikut:

Pada header tersebut bisa