JavaScript Sederhana Untuk Show Hide Banyak Content

Togle
JavaScript Show Hide - Ada banyak cara yang bisa kita pakai untuk menampilkan dan menyembunyikan objek dengan Script. Namun untuk cara sederhana-nya, saya akan lebih senang menggunakan JavaScript, karena ini tidak perlu menggunakan Framework layaknya jQuery.

Script ini bisa Anda terapkan untuk multi kontent dengan ID spesifik sebagai pembeda. Namun masih dengan Javascript yang sama. Artinya, berapa-pun jumlah konten yang ingin di sembunyikan, maka Anda hanya perlu menggunakan satu buah Javascript saja.

Langkah Pemasangan - Tempatkan kode sumber berikut kedalam BODY template blog.
<script type='text/javascript'>

function showHide(a) {
document.getElementById('button_' + a).style.display='none';
document.getElementById('content_' +a).style.display ='block';
}

</script>

- Kode berikut dipasang ke daerah yang mau ditampilkan konten showhide-nya, atau bisa juga diletakkan kedalam postingan blog Anda
<a href="javascript:showHide('1');" id="button_1">Tampilkan</a>
<div id="content_1" style="display:none;">Konten Tersembunyi Pertama</div>

<a href="javascript:showHide('2');" id="button_2">Tampilkan</a>
<div id="content_2" style="display:none">Konten Tersembunyi Kedua</div>

<a href="javascript:showHide('3');" id="button_3">Tampilkan</a>
<div id="content_3" style="display:none">Konten Tersembunyi Ketiga</div>
Keterangan:
Setiap ingin menambahkan tombol "Tampilkan" baru, wajib hukumnya menambahkan angka urut sesuai jumlah konten yang tersembunyi, atau silahkan buat seperti ketiga contoh diatas.