Cara Custom Scrollbar dengan Css dan Webkit

Cara Custom Scrollbar dengan Css dan Webkit - Pada kesempatan kali ini saya akan membagikan source code custom scrollbar, tutorial ini sangat mudah untuk dilakukan, tidak perlu membuat baris kode sampai banyak.

Apa itu Scrollbar ? Scrollbar merupakan sebuah alat yang digunakan untuk interaksi ke arah yang telah ditentukan komputer, jendela atau viewport sehingga semua konten dapat dilihat.

Baca Juga : Cara menambahkan Centang di Judul Postingan Blog

Nah kurang lebih untuk penjelasan tentang Scrollbar seperti diatas, langsung saja mari kita lanjut ke tuitorial, pada tutorial ini saya menggunakan Blogger:

1. Buka Blogger.

2. Klik Tema > Klik Edit HTML : Kemudian cari tag </head> lalu letakan kode dibawah ini tepat diatas tag tersebut.

<style type='text/css'>
/* scrollbar */
/* width */
::-webkit-scrollbar {
  width: 10px;
}

/* Track */
::-webkit-scrollbar-track {
  background: #F1C40F;
  border-radius: 15px 0px 15px 0;
}

/* Handle */
::-webkit-scrollbar-thumb {
  background: #18227f;
  border-radius: 15px 0px 15px 0;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: #187f6e;
  border-radius: 15px;
}
</style>

3. Simpan Tema dan lihat hasilnya.

Itulah tutorial tentang Cara Custom Scrollbar dengan Css dan Webkit, semoga bermanfaat buat teman-teman semua ya.