Cara Membuat Elemen Halaman Mempunyai Fungsi Scroll

U

ntuk melihat demonya anda bisa melihat dibagian atas blog saya ini.Cara Membuat Elemen Halaman Mempunyai Fungsi Scroll sangatlah mudah.anda tidak harus membuat kode HTML yans sangat banyak,melainkan hanya sedikit kode untuk membuatnya.berikut cara membuat elemen halaman mempunyai fungsi scroll.

1. Masuk ke akun Blogger Anda.

2. Klik Rancangan > Elemen Laman > Tambah Gadget.

3. Pilih HTML/JavaScript.

4. Copy dan paste kode di bawah ini di kolom Konten.

<div style="overflow:auto;width:autopx;height:200px;padding:5px;border:1px solid #e6e4e3;">

Isi Halaman / Kode Script Anda.

</div>

• overflow:auto;  kode ini agar tercipta scrolling atau penggulung halaman apabila isi dari halaman tersebut sudah melampaui batas tinggi atau lebar yang telah di tentukan.
• height:200 adalah tinggi halaman elemen.anda bisa ganti dengan ukuran sidbar blog anda.
• padding:5px; »  adalah kode pembuat jarak agar tulisan yang ada dalam halaman tersebut tidak menabrak dinding halaman, nilai ini tentu saja bisa di ubah sesuai keinginan. misal : padding:5px;
• border adalah style dot dengan ketebalan 1 piksel dan berwarna #e6e4e3;. Silakan diubah sesuai keinginan Sobat.
• solid adalah kode border tersebut anda dapat menggantinya dengan kode border anda bila belum ada border anda bisa pergi ke sini

Contoh:


<div style="overflow:auto;width:autopx;height:200px;padding:5px;border:1px solid #e6e4e3;">
<ol>
<li><span><span style="font-size: 14px; background-color: rgb(255, 255, 255);"><a href="http://lanoblog.blogspot.com/2011/09/cara-memasang-tombol-back-to-top-pada.html">Cara Memasang Tombol 'Back to Top' pada Blog</a></span></span></li><li><span><span style="font-size: 14px; background-color: rgb(255, 255, 255);"><a href="http://lanoblog.blogspot.com/2011/09/cara-memasang-tombol-share-dibawah.html">Cara Memasang Tombol Share DiBawah Postingan</a></span></span></li><li><a href="http://lanoblog.blogspot.com/2011/09/cara-memasang-widget-tombol-follow-me.html" style="font-size: 14px; background-color: rgb(255, 255, 255); ">Cara Memasang Widget Tombol Follow Me Twitter</a></li><span><span style="font-size: 14px; background-color: rgb(255, 255, 255);"><li><span><span style="font-size: 14px; background-color: rgb(255, 255, 255);"><a href="http://lanoblog.blogspot.com/2011/09/cara-menghilangkan-icon-obeng-dan-tang.html">Cara Menghilangkan Icon Obeng dan Tang pada Blogger</a></span></span></li><li><a href="http://lanoblog.blogspot.com/2011/09/menghilangkan-icon-sampah-pada-kotak.html">Cara Menghilangkan Icon Sampah Pada Kotak Komentar</a></li><li><span style="font-size: 14px; background-color: rgb(255, 255, 255); "><a href="http://lanoblog.blogspot.com/2011/09/cara-menghilangkan-diposkan-oleh-waktu.html">Cara Menghilangkan Diposkan oleh , Waktu Posting , Serta Label</a></span></li><li><a href="http://lanoblog.blogspot.com/2011/09/cara-menghilangkna-tulisan-lihat-profil.html">Cara Menghilangkan Tulisan 'Lihat Profil Lengkapku'</a></li><span><span style="font-size: 14px; background-color: rgb(255, 255, 255);"><a href="http://lanoblog.blogspot.com/2011/09/cara-menghilangkan-garis-border-gambar.html">Cara Menghilangkan Garis Border Pada Gambar</a><span><span style="font-size: 14px; background-color: rgb(255, 255, 255);"><li><span style="font-size: 14px; background-color: rgb(255, 255, 255); "><a href="http://lanoblog.blogspot.com/2011/09/cara-menghilangkan-garis-bawah-link.html">Cara Menghilangkan Garis Bawah Pada Link</a></span></li><li><a href="http://lanoblog.blogspot.com/2011/09/cara-mengetengahkan-widget.html">Cara Mengetengahkan Widget</a></li><span><span style="font-size: 14px; background-color: rgb(255, 255, 255);"><li><span style="font-size: 14px;"><a href="http://lanoblog.blogspot.com/2011/09/cara-pasang-meta-tag-goggle-di-blogger.html">Cara Pasang Meta Tag Goggle Di Blogger</a></span></li><li><span><span style="font-size: 14px; background-color: rgb(255, 255, 255);"><a href="http://lanoblog.blogspot.com/2011/09/cara-pasang-meta-tag-bing-di-blog.html">Cara Pasang Meta Tag Bing Di Blogger</a></span></span></li><li><span style="font-size: 14px; background-color: rgb(255, 255, 255); "><a href="http://lanoblog.blogspot.com/2011/09/cara-daftar-dan-pasang-meta-tag-alexa.html">Cara Daftar Dan Pasang Meta Tag Alexa</a></span></li><li><span style="font-size: 14px; background-color: rgb(255, 255, 255); "><a href="http://lanoblog.blogspot.com/2011/09/cara-pasang-meta-tag-yahoo.html">Cara Pasang Meta Tag Yahoo</a></span></li><li><a href="http://lanoblog.blogspot.com/2011/09/cara-pasang-alexa-traffic-rank-button.html">Cara Pasang Alexa Traffic Button</a></li><li><a href="http://lanoblog.blogspot.com/2011/09/cara-memasang-widget-histats-di-blogger.html">Cara Pasang Widget Histats</a></li><span><span style="font-size: 14px; background-color: rgb(255, 255, 255);"><li><span style="font-size: 14px; background-color: rgb(255, 255, 255); "><a href="http://lanoblog.blogspot.com/2011/09/cara-mendaftarkan-blog-ke-mesin-pencari.html">Cara Mendaftarkan Blog Ke Mesin Pencari ( Goggle , Yahoo , Bing , Baidu )</a></span></li><li><span style="font-size: 14px; background-color: rgb(255, 255, 255); "><a href="http://lanoblog.blogspot.com/2011/09/cara-membuat-artikel-terkait-dibawah.html">Cara Membuat Artikel Terkait Dibawah Postingan</a></span></li><li><span style="font-size: 14px; background-color: rgb(255, 255, 255); "><a href="http://lanoblog.blogspot.com/2011/09/cara-membuat-border.html">Cara Membuat Border</a></span></li><li><a href="http://lanoblog.blogspot.com/2011/09/cara-membuat-link-berkedip-kedip.html">Cara Membuat Link Berkedip-kedip</a></li><li><a href="http://lanoblog.blogspot.com/2011/09/cara-membuat-link-warna-warni-saat.html">Cara Membuat Link Warna-Warni Saat Disentuh Cursor</a></li><span><span style="font-size: 14px; background-color: rgb(255, 255, 255);"><li><a href="http://lanoblog.blogspot.com/2011/09/cara-membuat-huruf-awal-postingan.html">Cara Membuat Huruf Besar Diawal Postingan</a></li><li><a href="http://lanoblog.blogspot.com/2011/09/cara-membuat-buku-tamu.html">Cara Membuat Buku Tamu</a></li><li><a href="http://lanoblog.blogspot.com/2011/09/cara-membuat-read-more-otomatis.html">Cara Membuat Read More Otomatis</a></li><li><a href="http://lanoblog.blogspot.com/2011/09/cara-membuat-3-kolom-dibawah-header.html">Cara Membuat 3 Kolom Dibawah Header</a></li><li><a href="http://lanoblog.blogspot.com/2011/09/cara-membuat-kotak-komentar-admin.html">Cara Membuat Kotak Komentar Admin Berbeda Dengan Pengunjung</a></li><li><a href="http://lanoblog.blogspot.com/2011/09/cara-membuat-kotak-komentar-admin_28.html">Cara Membuat Kotak Komentar Admin Berbeda Dengan Pegunjung Dengan Background Gambar</a></li><li><a href="http://lanoblog.blogspot.com/2011/09/cara-membuat-link-saat-berkomentar.html">Cara Membuat Link Saat Berkomentar</a></li><li><a href="http://lanoblog.blogspot.com/2011/09/membuat-menu-navigasi-breadcrumb.html">Cara Membuat Menu Navigasi Breadrumb</a></li><li><a href="http://lanoblog.blogspot.com/2011/09/cara-mengganti-favicon-blog.html">Cara Mengganti Favicon Blog</a></li></span></span></span></span></span></span></span></span></span></span></span></span></ol></div>


Maka Hasilnya Seperti Dibawah Ini :

1. Cara Memasang Tombol 'Back to Top' pada Blog
2. Cara Memasang Tombol Share DiBawah Postingan
3. Cara Memasang Widget Tombol Follow Me Twitter
4. Cara Menghilangkan Icon Obeng dan Tang pada Blogger
5. Cara Menghilangkan Icon Sampah Pada Kotak Komentar
6. Cara Menghilangkan Diposkan oleh , Waktu Posting , Serta Label
7. Cara Menghilangkan Tulisan 'Lihat Profil Lengkapku'
Cara Menghilangkan Garis Border Pada Gambar
8. Cara Menghilangkan Garis Bawah Pada Link
9. Cara Mengetengahkan Widget
10. Cara Pasang Meta Tag Goggle Di Blogger
11. Cara Pasang Meta Tag Bing Di Blogger
12. Cara Daftar Dan Pasang Meta Tag Alexa
13. Cara Pasang Meta Tag Yahoo
14. Cara Pasang Alexa Traffic Button
15. Cara Pasang Widget Histats
16. Cara Mendaftarkan Blog Ke Mesin Pencari ( Goggle , Yahoo , Bing , Baidu )
17. Cara Membuat Artikel Terkait Dibawah Postingan
18. Cara Membuat Border
19. Cara Membuat Link Berkedip-kedip
20. Cara Membuat Link Warna-Warni Saat Disentuh Cursor
21. Cara Membuat Huruf Besar Diawal Postingan
22. Cara Membuat Buku Tamu
23. Cara Membuat Read More Otomatis
24. Cara Membuat 3 Kolom Dibawah Header
25. Cara Membuat Kotak Komentar Admin Berbeda Dengan Pengunjung
26. Cara Membuat Kotak Komentar Admin Berbeda Dengan Pegunjung Dengan Background Gambar
27. Cara Membuat Link Saat Berkomentar
28. Cara Membuat Menu Navigasi Breadrumb
29. Cara Mengganti Favicon Blog

5. SIMPAN