Search

Cara menampilkan tombol 'Show Hide' pada blog

Unknown | 01.32 | 0 komentar

Hari ini Saya akan memberikan trik
Cara Membuat Tombol Show Hide Pada Posting Blog.
Gunanya yang pasti untuk memperindah tampilan posting dan memperpendek tulisan atau kode untuk mengedit blog yang berpengaruh pada kecepatan/loading pada blog.

Klik show untuk melihat
Contoh show hide
Di dalam tombol ini kita bisa memasukan tulisan dan photo.
Caranya mudah kok…
Caranya:

1.Buat artikel kalian seperti biasa.
2.Jika sudah klik tab html
3.Lalu masukkan kode  ini:
<div><div style="margin-bottom: 2px;">
<input 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'; }" style="font-size: 10px; margin: 0px; padding: 0px; width: 60px;" type="button" value="Show" /></div>
<div style="border: 0px inset; margin: 0px; padding: 6px;">
<div style="display: none; border:1px dotted #ffffff;">
Isi Text Anda Disini
</div></div></div>
NB: Ganti Tulisan berwarna merah dengan tulisan atau link foto yang anda inginkan !



Category:

About GalleryBloggerTemplates.com:
GalleryBloggerTemplates.com is Free Blogger Templates Gallery. We provide Blogger templates for free. You can find about tutorials, blogger hacks, SEO optimization, tips and tricks here!

0 komentar

Rabu, 17 Oktober 2012

Cara menampilkan tombol 'Show Hide' pada blog

Hari ini Saya akan memberikan trik
Cara Membuat Tombol Show Hide Pada Posting Blog.
Gunanya yang pasti untuk memperindah tampilan posting dan memperpendek tulisan atau kode untuk mengedit blog yang berpengaruh pada kecepatan/loading pada blog.

Klik show untuk melihat
Contoh show hide
Di dalam tombol ini kita bisa memasukan tulisan dan photo.
Caranya mudah kok…
Caranya:

1.Buat artikel kalian seperti biasa.
2.Jika sudah klik tab html
3.Lalu masukkan kode  ini:
<div><div style="margin-bottom: 2px;">
<input 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'; }" style="font-size: 10px; margin: 0px; padding: 0px; width: 60px;" type="button" value="Show" /></div>
<div style="border: 0px inset; margin: 0px; padding: 6px;">
<div style="display: none; border:1px dotted #ffffff;">
Isi Text Anda Disini
</div></div></div>
NB: Ganti Tulisan berwarna merah dengan tulisan atau link foto yang anda inginkan !



Tidak ada komentar:

Posting Komentar

Arsip Blog