Dec 19, 2011

Tutorial Scrollbar Serba Guna part 2

Assalamualaikum and a very pleasant day everyone!

Nak tahu scrollbar boleh digunakan untuk apa?klik Tuto Scrollbar Serba Guna part 1.Kali ni aku nak sambung kegunaan scrollbar yang lain.Mungkin korang dah tahu tapi aku nak share jugak :)

Scrollbar Untuk Blog
Tuto ni dimintak oleh adik Ainina Faseeha.Untuk pengguna google chroome,korang akan nampak scrollbar kat tepi blog aku ni yang berbelang hitam.Perhatian,aku guna Denim Template ye :)

Design    Edit Html    Klik expand widget templates
Klik ctrl F serentak dan cari kod  /* Header

copy kod di bawah ini dan pastekan di atas kod   /* Header tadi.
::-webkit-scrollbar {height:12px;width: 12px;background: url(URL YANG KORANG SUKA);}::-webkit-scrollbar-thumb {background-color: #100E0E;-moz-border-radius: 10px;border-radius: 10px;}
Untuk pengguna template lain sila ikut tuto dibawah ini.

Design    Edit Html    Klik expand widget templates
Ctrl+F cari kod   ]]></b:skin>
copy kod dibawah dan paste di atas kod  ]]></b:skin> tadi.
::-webkit-scrollbar {
height:12px;
width: 12px;
background: #FFFFFF;
}
::-webkit-scrollbar-thumb {
background-image:url(URL GAMBAR);
-moz-border-radius: 10px;
border-radius: 10px;
}}

Scrollbar Untuk Ruangan Komen
Tutorial ini hanya untuk pengguna denim template macam aku ye!
Design    Edit Html    Klik expand widget templates
ctrl F serentak dan cari kod  /* Comments
kemudian paste kod ini dibawah  /* Comments
#comments {
height:150px;
overflow:auto;
}
nanti kod tu semua akan jadi macam ni:
/* Comments
----------------------------------------------- */
#comments {
height:150px;
overflow:auto;
Dah siap semua?Preview dan save!Yang aku bold warnakan merah silalah tukar suka hati korang ye!

-Ini tutorial tambahan.Tuto yang dimintak oleh Afiqah.-
Cik Teddy cuma guna kod dibawah untuk background di sidebar..
<div style="background:url(URL BACKGROUND) repeat; repeat; padding: 5px; border:2pxdashed#000000; border-top-left-radius: 20px 20px; border-top-right-radius: 20px 20px; border-bottom-left-radius: 20px 20px; border-bottom-right-radius: 20px 20px;"><center></center>
Masukkan apa2 kod @ ayat
</div>
biru: boleh tukar jadi solid @ dotted.
pink: kod warna yang korang suka la..

brand new stylish Optima K5 here <<
start the New Year with this extraordinary event here <<

15 Pemisah Kata:

kim heeruul said...

nak scroll bar bloglist.. huawaaaaa.. menangis..
mlm ti pukol 12 gua post entry baru.

Pendamba Mawar said...

oooo cm tu baru tahu

Adib Asyraff . said...

valuable sgt cikteddy ! :)
cikteddy , kalau cikteddy singgah belog saya , jgn lupa click semuaa iklan churpchurp kat atas tu .. pastu close lahh . thanks sbb visit :)

Nerdy Zuera said...

:) nice tuto kakak .:)

Chenta said...

Thanks for sharing info about tutorial.. =)

Teenager Housemaid said...

errr...scroll bar ni ape eh?
sorry saya kurang celik it...
T.T

Mohamad Azizi Md Said said...

tuto cik menjadi la ^^ saya dah try review blog lain tntang tuto scrollbar kat komen, tapi semua x menjadi. kat sini je.. huhu

Nisa Greennnpanda said...

nice, hehe..tutorial scroll utk bloglist & labels ade x? hihi...

eVa said...

wow! hari tu nak tanya.. hehehe.. ingin nak cuba.. kaler boleh tuka tak.. mcm mana nak tuka kaler.. ada code dia?.. sory byk tanya.. kalau pasal code2 ni kepala penin ckit.. sbb slalu kwn sy yang settingkan.. hehe..

eVa said...

tq so much! hehehe.. nanti nak cuba yer..

Ainina Faseeha said...

tq coz' sudi wat tuto nih... cyang akak lah! :)

wanabee said...

waa....thanks for sharing cikteddy ..entri berguna ... hee ^_^

khairul said...

pandai la Siti...TQ

Juliet_iRa~" said...

thankss..heee..

nt blh guna kalo nk buat scroll bar tu..:)

Afiqah Nabilah said...

tq kakak.. :)