Membuat Tombol Show Hide Pada Posting

Artikel kali ini, aritherev mencoba untuk mengulas bagaimana cara membuat tombol show hide pada postingan kita dimana saat kita tekan tombol-nya maka paragraf yang disembunyikan akan ditampilkan dan ketika ditekan tombol hide lagi maka paragraf akan disembunyikan kembali.
Ini biasanya berfungsi untuk menampilkan sejumlah script atau kata - kata untuk memperpendek dan memperunik postingan kita. Seperti ini contohnya:

Letakkan Text Yang Anda Ingin Sembunyikan Disini

Penasaran bukan ???
Untuk membuat tombol show hide kita tinggal masukkan script berikut.

<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="text-align: left; padding:10px; border: 3px inset #333; "> Masukkan Teks Anda Disini
</div></div>
</div>
</div></div>

Related Articles