Tombol Hide and Show

Lagi senengnya share tentang hide and show ni teman, pada artikel sebelumnya membuat chatbox hide and show.. Nah kali ini saya akan share cara bikin tombol hide and show, seperti pada category di sidebar kanan, cekidot caranya:

1. Tab Rancangan, Elemen Halaman
2. Tambah Gadget, HTML/JavaScript
3. Copas kode berikut:

<div><div style="margin-bottom: 2px;"><input style="margin: 0px; padding: 0px; width: 150px; font-size: 10px;" value="TUTORIAL" 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;TUTORIAL&#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;TUTORIAL&#39;; }" type="button" /></div>
<div style="border: 0px inset ; margin: 0px; padding: 6px;"><div style="display: none;">
&nbsp;&nbsp;&nbsp;<a href="url anda">GuestBook</a><br />
</div></div></div>

contoh penampakan:

   GuestBook

Simpan deh.. oke..
Semoga Bermanfaat.