Latest News

Membuat Tombol Hide Dan Show Di blog

By Admin - Minggu, 27 Maret 2011


bloggerTulisan ini aku buat karena tertarik dengan tombol hide dan show seperti yang ada di kaskus.. udah telat sich... tetapi namanya belajar dan keinginantahuan sudah pasti tidak ada kata telat... betul...?


Tombol Hide dan show ini sangat berguna sekali untuk memangkas ruang halaman, terutama untuk penempatan gambar atau hal-hal yang spesifik lainnya.

Caranya pun cukup mudah... coba perhatikan tombol yang ada dibawah ini, kondisinya bila di klik maka akan tampil box halaman yang berisi kode cara pembuatan tombol hide dan show, dan bila di klik lagi, halaman tersebut akan disembunyikan lagi... cek it dot..






<div>

<div style="margin: 1px;">

<div class="smallfont" style="margin-bottom: 1px;">

<input value="SHOW" style="margin: 0px; padding: 0px; width: auto; font-size: 10px;" onclick="if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = ''; this.innerText = ''; this.value = 'HIDE'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'SHOW'; }" type="button"/></div>

<div class="alt2">

<div style="display: none;">

<div style="background:#808080; text-align: center; padding:10px; "> Disini adalah kalimat atau gambar yang akan muncul di box hide dan show

</div>

</div>

</div>

</div>

</div>


Follow our blog on Twitter , become a fan on Facebook . Stay updated via RSS

0 komentar for " Membuat Tombol Hide Dan Show Di blog "

Leave a Reply