Scrollbar For Blog

Hai, all!

Aku share tutorial ini buat kamu yang pengen scrollbar cantik. Silahkan disimak ya tutorial nya!

1. Login ke Blogger
 2. Dashboard > Pilih Template
3. Pilh Edit HTML
4. Cari kode di bawah, gunakan ctrl + f agar lebih cepat

]]></b:skin>

atau kode

/*Header

5. Copy dan paste salah satu kode scrollbar dibawah:

• Scrollbar tipe 1

Code nya:

::-webkit-scrollbar {
width:15px;
height:10px;
}
::-webkit-scrollbar-button:start:decrement, ::-webkit-scrollbar-button:end:increment {
height:10px;
width:10px;
display:block;
background:#ADDFFF;
border:1px solid #842B00;
}
::-webkit-scrollbar-track-piece {
background-color:#FFFFFF;
}
::-webkit-scrollbar-thumb:vertical, ::-webkit-scrollbar-thumb:horizontal {
background-color:#ACD6FF;
border:1px solid #FFFFFF;

Scrollbar tipe 2

Codenya :

::-webkit-scrollbar {height: 12px;width: 12px;background: #ADDFFF;}::-webkit-scrollbar-thumb {background-color: #00AEAE;-moz-border-radius: 10px;border-radius: 10px;}::-webkit-scrollbar:hover {height:12px;width: 12px;background: #ADDFFF;}::-webkit-scrollbar-thumb:hover {background-color: #00CACA;-moz-border-radius: 10px;border-radius: 10px;}

• Scrollbar tipe 3 

Codenya :

::-webkit-scrollbar { width: 9px; height: 7px; } ::-webkit-scrollbar { width: 9px; height: 7px; } ::-webkit-scrollbar-button:start:decrement, ::-webkit-scrollbar-button:end:increment { height:10px; width:10px; display:block; background: #ADDFFF; border:1px solid #842B00; } ::-webkit-scrollbar-track-piece { background-color: #ADDFFF; border: 4px solid #fff; } ::-webkit-scrollbar-thumb:vertical, ::-webkit-scrollbar-thumb:horizontal { background-color: #ff7575; border: 1px groove #FE80DF; }

Oke, sampai disini dulu ya tutorial nya.. Lanjut besok ^^ Hmm.. warna scrollbar nya bisa kalian ubah kok.. Hmm.. See ya!

Credit: Chiaki Tachikawa