Rabu, 20 Juni 2012

Cara membuat show/hide di blog

Sekarang Saya akan Share cara membuat menu Show/Hide. Tutorial ini saya dapat dari teman saya (Ini) Maksudnya adalah ketika anda klik Show/Hide maka akan muncul konten atau sesuatu yang kita letakkan didalamnya, dan kalau di klik 1 kali lagi maka konten tersebut akan tersembunyi kembali.
Silahkan disimak caranya dibawah ini :
1. Login Ke Akun Blogger Anda
2. Ke Tata letak lalu pilih tambah gadget.
3. pilih HTML/Java Script.
4. Letakkan kode/Script dibawah ini.

<div><div style="margin: 20px; margin-top:5px"><div style="margin-bottom: 2px;" class="smallfont"><input style="margin: 0px; padding: 5px; width: auto; " value="Show" 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 = 'Hidden'; } 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="border: none; color:none; background-color:none; text-align: justify; padding:10px;">
TARUH SCRIPT / KONTEN KALIAN DISINI
</div></div></div></div></div>



Catatan :
1. Tulisan yang berwarna orange bisa anda ganti dengan Tulisan anda.
2. Tulisan yang berwarna hijau adalah tempat anda meletakkan konten / Script anda.
Contoh :

Selamat Mencoba ! Semoga Bermanfaat !!

0 komentar:

Posting Komentar