Cara Membuat Tombol Hide dan Show

Cara Membuat Tombol Hide dan Show
Buat kamu ingin menyembunyikan gambar maupun tulisan di balik tombol Hide dan Show. Berikut kode html mengenai Cara Membuat Tombol Hide dan Show.

<div>

<input value="Tampilkan" style="margin: 0px; padding:0px;width:auto;font-size:10px;" onclick="if(this.parentNode.parentNode.getElementsByTagName(&#39;div&#39;)[1].getElementsByTagName(&#39;div&#39;)[0].style.display != &#39;&#39;) { this.parentNode.parentNode.getElementsByTagName(&#39;div&#39;)[1].getElementsByTagName(&#39;div&#39;)[0].style.display = &#39;&#39;; this.innerText = &#39;&#39;; this.value = &#39;Sembunyikan&#39;; } else{ this.parentNode.parentNode.getElementsByTagName(&#39;div&#39;)[1].getElementsByTagName(&#39;div&#39;)[0].style.display = &#39;none&#39;; this.innerText = &#39;&#39;; this.value = &#39;Tampilkan&#39;; }" type="button" /></div>
<div class="alt2">
<div style="display: none;">
<div style="background:#000000;text-align:left;padding:10px;color:#ffffff;">
Masukkan text-nya disini. Gambar juga bisa.
</div>
</div>
</div>



Hasilnya seperti berikut

Perhatikan teks yang di cetak warna hijau dan kuning, anda dapat mengubah/mengedit teks yang di cetak warna hijau dan kuning.

SELAMAT MENCOBA

Semoga bermanfaat.
sumber ; http://agungpatiwidagdo.blogspot.com