Tutorial : Membuat Show / Hide Button



Assalamualaikum...hari ni caer nak berkongsi satu lagi tutorial yang caer sendiri telah aplikasikannya di dalam blog....fungsi button show / hide ni adalah bertujuan untuk menjimatkan ruang di dalam blog dan boleh make sure blog menjadi simple serta kemas...tutorial ni caer tujukan buat sahabat2 blogger terutama buat blogger PERGH yang telah request tutorial pagi tadi...hehe...jom cuba !!

1) Login blog >> dashboard >> design >> add a gadget >> HTML / javascript

2) Masukkan kod di bawah dalam ruangan yang disediakan
<center><div><div style="margin: 5px;">
<div style="margin-bottom: 2px;" class="bigfont"><input style="margin: 0px; padding: 0px; width: 95px; " value="Ketuk" 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;Tutup&#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;Ketuk&#39;; }" type="button" />
</div>
<div style="border: 0px inset ; margin: 0px; padding: 6px;" class="alt2">
<div style="display: none;">

( Korang boleh ubah perkataan "ketuk" dan "tutup" tu mengikut citarasa tersendiri )

3) Masukkan koding yang korang mahukan.Contohnya : shoutbox , post terkini etc

4) Masukkan koding di bawah ni sebagai penutup
</div></div></div></div></center>

5) Preview dan save jika sudah berpuas hati

P/s : sebarang pertanyaan boleh tinggalkan komen kat entri ni bagi memudahkan caer untuk membalas...selamat mencuba !!

 
copyright reserved by caersasuke