Jika Ada Link Dalam Blog Ini Yang Tidak Berfungsi Atau Broken, Dengan Segala Kerendahan Hati Kami Berharap Pengunjung Sekalian Meng-Infokan Kepada Kami Agar Se-segera Mungkin Kami Memperbaikinya,TERIMA KASIH..!!BLOG ANAK BIMA mengucapkan "SELAMAT HARI RAYA IDUL ADHA 1437H MOHON MAAF LAHIR DAN BATIN" @Admin [by:dyenps]

Wednesday, August 1, 2012

Membuat Tombol Show dan Hide

Berikut cara membuat nya :
Tinggal Copy Aja Codenya di bawah pastekan dalam postingan sobat pada tulisan atau gambar yang ingin di sembunyikan,ini codenya;






<div><div style="margin-bottom: 2px;"><b><small>Klik show untuk melihat</small></b>
<input value="Show" style="margin: 0px; padding: 0px; width: 60px; font-size: 14px;" 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 style="border: 1px inset; margin: 0px; padding: 6px;"><div style="display: none;">
Masukkan tulisan yang hendak di sembunyikan di sini
</div></div></div>
Hasil nya seperti ini:


Klik show untuk melihat
Masukan tulisan yang hendak disembunyikan disini

Ket; width: 60px :adalah lebar tombol  Show/hide
border: 1px : Untuk menampilkan garis pinggir seperti di atas,jika tidak ingin menampilkan garis pinggir rubah saja menjadi  border: 0px ,maka akan seperti dibawah:

Klik show untuk melihat
Masukan tulisan yang hendak disembunyikan disini


Artikel Terkait:

2 comments:

  1. @Andi,makasih pujianya,mudah-mudahan saya gak besar kepala....^_^

    ReplyDelete

Syarat Berkomentar:
Tanpa Sara
Tanpa Spam
Jangan Membuat Link Hidup Di Tengah Komentar
Berkomentarlah Yang Sopan Dan Bijak Agar Diharagai Oleh Orang Lain.
Komentar Yang Mengabaikan Syarat Diatas Akan Di Hapus,Terima Kasih...!

Followers

Google+ Followers

Share

Twitter Delicious Facebook Digg Stumbleupon Favorites More