Membuat Efek Scroll

membuat efek scroll Memberikan efek scroll pada content merupakan solusi yang tepat untuk anda yang ingin memperingkas halaman blog anda. Terlebih untuk bagian sidebar dan bottom bar yang memiliki ruang sempit untuk dipasang widget. Kode untuk membuat scroll tidak terlalu rumit, bahkan bisa dikatakan lebih simple daripada kode-kode yang lain. Untuk membuatnya silakan anda copy code di bawah ini.

<div style="overflow:auto; width:300px; height:150px; padding:10px; border:1px solid #eee">letakkan content anda di sini</div>

Keterangan :

pada kode width, angka 300 menunjukkan lebar kotak scroll
pada kode width, angka 150 menunjukkan tinggi kotak scroll
pada kode border, kode #eee menunjukkan warna border kotak scroll

Misalnya saya ingin membuat daftar nama teman-teman saya.

Avin
Awan
Bams
Brink
Cemed
Dendy
Didot
Dimas
Dion
Dony
Ferry
Gache
Gepenk
Irul
Iqbal
MD
Memed
Ndaru
Sonny
Suject

Dengan sedikit penambahan kode CSS diatas, efek scrollpun jadi. ^^, Selamat mencoba dan semoga bermanfaat.

18 Comments:

ph-internet said... on June 8, 2010 at 6:06 AM: manfaat sekali buat saya yang masih baru sob..
berita untuk negri said... on June 8, 2010 at 6:08 AM: bagus sob karena aku belum kasih scroll di blog ku,,terima kasih sharingnya sob
Rizkyzone said... on June 8, 2010 at 6:14 AM: mantab dah sob lanjutkan.... wiggeet aq dah aq scrool double sama spoilernya juga
Rezky Pratama said... on June 8, 2010 at 6:18 PM: oke dah
nambah2 ilmu
mantap...
ryankampur said... on June 8, 2010 at 7:27 PM: wah mantap sob,,,
kunujungan perdana,,, perdana??? udah kayak sim card ajah... hehehe
Rock said... on June 9, 2010 at 12:46 AM: Scoll memang wajib ya sob... hahaha....
Etc News said... on June 9, 2010 at 12:51 AM: Oiya sob, tukeran link yuk...
"MasdaZine" sudah nongkrong di "Etc News"
Etc News said... on June 9, 2010 at 1:30 AM: Ok, makasih sob...
DonyaBisnis said... on June 9, 2010 at 6:24 AM: thx tipsnya.,sangat bermanfaat..sy ingn buat di blogroll mdah2an sukses
om_rame said... on June 9, 2010 at 7:19 AM: terima kasih atas tutoriaLnya, sangat bermanfaat untuk mengefektifitaskan tampiLan bLog yang minimaList.
gayuh said... on June 9, 2010 at 7:44 AM: makasih banyak tutorialnya juragan.. aku langsung praktek nich...
odonk's said... on June 9, 2010 at 8:38 AM: wah nice tutorial brad...
ntr ane cobain deh :D
Blogger said... on June 9, 2010 at 10:34 AM: wah ternyata kodenya lebih sederhana dan relatif sedikit yach sob, thanks sharingnya
Sukses Slalu!
Belajar SEO Blogspot said... on June 9, 2010 at 6:18 PM: iya mas, udah pernah saya coba tipsnya..tapi kekurangannya kalo buka dari hp ga bisa di scrool :-/
Regi_Adi said... on June 10, 2010 at 5:34 AM: betul juga nih, bisa menghemat space di blog kita.
tapi kelemahannya kalau pake opera mini, scroll ngga muncul. jadi susah liat isinya.
Review Blog Gratis said... on June 10, 2010 at 9:54 PM: @Belajar SEO Blogspot dan Regi_Adi:
di Opera Mini memang tidak bisa, tapi kalau pake UCWEB bisa kog. Browser bawaannya Sony Ericsson G502 malah bisa. Agak aneh dengan Opera Mini, tapi ini mungkin efek dari prosedur kompresinya yang bagus, dengan mengorbankan script seperti ini. Kalau UCWEB memang terasa lebih bagus, tapi ya itu kalau pake internet berbasis data ya jembret mbayarnya, hehe ...
Salam
Dayas||Brothers said... on January 2, 2011 at 8:23 PM: Mantab bgt untuk newbie kya ane.
thanks infonya...
fishing reel said... on August 13, 2011 at 3:32 AM: ini baru cocok setelah muter muter mencari, terima kasih banyakini baru cocok setelah muter muter mencari, terima kasih banyak

Blog ini "DOFOLLOW", Silakan tinggalkan komentar anda, bebas tapi sopan. Tidak kami anjurkan untuk mencantumkan link pada komentar serta memakai nama Anonymous.

Komentar yang bernada SPAM atau SARA akan kami hapus.

:)) ;)) ;;) :D ;) :p :(( :) :( :X =(( :-o :-/ :-* :| 8-} :)] ~x( :-t b-( :-L x( =))