Membuat Drop Down & Scroll

Setiap usaha pasti ada hasil. Nah... Setiap hasil yang diperoleh pasti emmbutuhkan tempat, Apa hubungannya ya... OK langsung ke TKP.. DropDown dan Scroll dibuat biasanya memiliki tujuan untuk menghemat tempat.

1. DropDown
   Dengan dropdown menu kita bisa menghemat space/ruang di blog kita, karena dengan ukuran yang kecil seperti itu bisa menyimpan link dan text yang banyak. Itu bisa diisi dengan arsip, blogroll dll. Gimana? Mau mencobanya? caranya : Login ke blogger, trus masuk ke menu "Page Element" trus pilih Add page elements --> HTML/JavaScript. Kemudian masukkan script berikut ini :
   Scrip Dasar
   

   <select onChange="document.location.href=this.options[this.selectedIndex].value;"> <option value="0" selected>Arsip Blog</option> <option value="Links 1">Text 1</option> <option value="Links 2">Text 2</option> </select>

   Ganti Scrip yang berwarna Biru untuk Link yang akan dituju
   Ganti Scrip yang berwarna Hujau untuk Keterangan yang akan ditampilkan
   Contoh Scrip
   

   <select onChange="document.location.href=this.options[this.selectedIndex].value;"> <option value="0" selected>Tutorial Blog</option> <option value="http://ariskoerniawan.blogspot.com/2011/04/tutoriallogo.html">Mengganti Logo Blog</option> <option value="http://ariskoerniawan.blogspot.com/2011/04/cara.html">Perangkat Penunjang Bloger</option> <option value="http://ariskoerniawan.blogspot.com/2011/04/bintang.html">Aksesoris Bintang Pada Link & Kursor</option> </select>

   Hasil Tampilan
   Tutorial Blog Mengganti Logo Blog Perangkat Penunjang Bloger Aksesoris Bintang Pada Link & Kursor
   
2. Scroll
   pada dasarnya pembuatan scroll dan DropDown hampir sama fungsi juga hampir sama
   Srip Dasar

   <div style="overflow:auto;width:200px;height:100px;padding:10px;border:1px solid #eee"> <u>Silahkan Klik Post Dibawah Ini</u> Data 1 Data 2 Data 3 </div>

   ganti ukuran dengan mengganti nilai width & height untuk penyesuaian data yang anda masukan
   Hasil Tampilan
   
   Silahkan Klik Post Dibawah Ini
   Data 1
   Data 2
   Data 3
   
   Selain itu kita juga bisa memberi Link pada Keterangan yang diberikan.
   Contoh Scrip

   <div style="overflow:auto;width:200px;height:100px;padding:10px;border:1px solid #eee"> <u>Silahkan Klik Post Dibawah Ini</u> <a href="http://ariskoerniawan.blogspot.com/2011/04/pajak.html">Perpajakan</a> <a href="http://ariskoerniawan.blogspot.com/2011/04/dea.html">DacEasy Accounting</a> <a href="http://ariskoerniawan.blogspot.com/2011/04/myob_09.html">MYOB Accounting</a> </div>

   Hasil Scroll Dengan Link
   
   Silahkan Klik Post Dibawah Ini
   Perpajakan
   DacEasy Accounting
   MYOB Accounting