23 September 2010

Cara Membuat Menu Pulldown di Blog

menu_pulldown
Apa sih yang namanya menu pulldown, dan seperti apa wujud menu tersebut? Menu yang satu ini sebetulnya sudah tidak asing lagi bagi kita karena hampir setiap computer yang pernah kita jumpai semuanya memuat si menu pulldown itu.

Menu Pull down menurut definisi brugkembar yaitu sederetan menu yang tersusun vertical dimana akan muncul setelah tombol tanda panah ke bawah kita klik. Gimana udah jelaskah dikau? Atau masih bingung. Nih biar enggak bingung perhatikan gambar di bawah ini, kalau mau coba silahkan klik saja biar sekalian tau manfaat dari menu pulldown.



Mengenai cara pembuatannya, ikuti terus tips ini sampai selesai.
Secara garis besar, kode untuk membuat menu pulldown adalah sebagai berikut:
<select name="menu" size="1" onchange="window.open(this.options
[this.selectedIndex].value,'_blank')" style="width: 300px;">
<option selected="" value="0">JUDUL MENU
</option><option value="Link1">Judul Link1
</option><option value="Link2"> Judul Link2
</option><option value="Link3"> Judul Link3
</option></select>
Keterangan :
  1. 300px; adalah lebar menu pulldown
  2. Ganti tulisan Link dengan Link milik anda
  3. Judul Link adalah tulisan yang akan nampak bila menu pulldown diklik.
Sebagai contoh misalkan saya akan buat menu pulldown dengan komposisi seperti ini:
  • Judul menu :  Link Pendidikan
  • Isi menu :
  1. Situs Resmi, yang beralamat di http://tunjangan-sertifikasi.blogspot.com/2010/09/situs-resmi-sertifikasi-guru.html
  2. Sertifikasi, yang beralamat di http://sertifikasiguru.org/
  3. NUPTK, yang beralamat di http://pmptk.kemdiknas.go.id/
  4. NISN, yang beralamat di http://nisn.jardiknas.org/

Maka Kode seluruhnya menjadi:
<select name="menu" size="1" onchange="window.open(this.options [this.selectedIndex].value,'_blank')" style="width: 300px;"><option selected value="0"><span style="font-weight:bold;">.: Link Pendidikan :.</span><option value="http://tunjangan-sertifikasi.blogspot.com/2010/09/situs-resmi-sertifikasi-guru.html">Situs Resmi<option value="http://sertifikasiguru.org/">Sertifikasi<option value="http://pmptk.kemdiknas.go.id">NUPTK<option value="http://nisn.jardiknas.org/">NISN</select>
Dan hasil jadinya seperti ini :



Selamat membuat menu pulldown dan memasangnya di blog, semoga berhasil.

No comments:

Post a Comment

Note: Only a member of this blog may post a comment.