adsense link 728px X 15px

Tuesday, June 8, 2010, 

membuat efek scrollMemberikan 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 :
  1. pada kode width, angka 300 menunjukkan lebar kotak scroll
  2. pada kode width, angka 150 menunjukkan tinggi kotak scroll
  3. pada kode border, kode #eee menunjukkan warna border kotak scroll

Misalnya saya ingin membuat daftar nama teman-teman saya.

  1. Avin
  2. Awan
  3. Bams
  4. Brink
  5. Cemed
  6. Dendy
  7. Didot
  8. Dimas
  9. Dion
  10. Dony
  11. Ferry
  12. Gache
  13. Gepenk
  14. Irul
  15. Iqbal
  16. MD
  17. Memed
  18. Ndaru
  19. Sonny
  20. 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

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

Post a Comment

 

It's Me

My Photo
Masda
Seorang blogger "KOTA GADIS" yang selalu penasaran dengan sesuatu hal yang baru. Belajar, belajar, dan terus belajar serta berusaha untuk menerapkannya. Karena menurut saya "Ilmu itu untuk diterapkan bukan untuk dipelajari".

Facebook Twitter
View my complete profile

Exchange Link

MasdaZine

Followers