FIFIANGGR - Personal Blog: Scrollbar Cantik For Your Blog

Scrollbar Cantik For Your Blog

06/02/16

1. Login ke Blogger

2. Dashboard > Pilih Template

3. Pilh Edit HTML

4. Cari kode di bawah, untuk Denim Template

/* Header

untuk Simple Template cari kode ini

]]></b:skin>

5. Copy dan paste salah satu kode scrollbar dibawah DIATAS kode no 4

Scrollbar tipe 1

kodenya :

::-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

kodenya :

::-webkit-scrollbar {
height:10px;
width: 10px;
background: #ECFAFF;
}
::-webkit-scrollbar-thumb {
background-color: #BBEBFF;-moz-border-radius: 5px;
border-radius: 5px;
div#toc-header, div#toc-display, div#toc-footer, table#toc-body {
width:100%;
}

Scrollbar tipe 3

kodenya :

::-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;
}

Note : warnanya kalian ubah sesuai keinginan kalian ya :)

Untuk Blogskin dan Classic Template

1. Login ke Blogger
2. Dashboard > Pilih Template
3. Cari kode ini