tattoos

Friday, December 11, 2009

Elemen Halaman Mempunyai Fungsi Scroll

Beberapa waktu yang lalu saya sempat bingung bagaimana cara supaya elemen halaman yang memiliki data benyak kelihatan simpel dan tidak terlalu panjang, karena akan kelihatan boros tempat dan akan mengurangi keindahan blog. Tetapi setelah berjalan-jalan dan melihat-lihat blog sobat, akhirnya saya mendapat inspirasi, yaitu membuat elemen halaman tersebut dengan fungsi scroll, jadi panjang dari elemen halaman tetap, dan isinya bisa sepanjang apapun yang kita mau, hanya dengan menggeser scroll naik dan turun untuk dapat melihat semua data yang ada.

Tutorial ini saya dapatkan di kolom tutorialnya milik Kang Rohman, memang Kang Rohman adalah tempat panduan belajar blog yang mantap, lengakap banget.. Hehe..

Contoh dari pemanfaatan Fungsi Scroll :

Bagus kan??? tidak perlu memakan tempat yang banyak jika ingin menampilkan data.

Untuk membuat fungsi scroll tersebut cukup mudah, berikut kode yang harus dipasang :

<div style="overflow:auto;


width:300px;


height:200px;


padding:10px;


border:1px solid #eee">


Taruh data disini


</div>



Silahkan isikan Data pada area yang bertulisakan “Taruh data disini”, dan berikut sedikit penjelasan dari kode tersebut :



> overflow:auto; » fungsi scroll.



> width:300px; »  lebar dari box.



> height:200px; »  tinggi dari box.



> padding:10px; »  jarak tulisan dengan tepi box.



> border:1px solid #eee » garis tepi box.



Selamat mencoba dan Happy Blogging…



Sumber : Kang Rohman

No comments:

Post a Comment

 

blogger templates | Blogger