Home » » Cara Membuat Tombol Show Hide Di Postingan Blog

Cara Membuat Tombol Show Hide Di Postingan Blog

Written By Unknown on Minggu, 04 Agustus 2013 | 20.54

Pada hari ini saya akan memberikan sedikit tips blog yang semoga bisa bermanfaat bagi kita semua. Tipsnya adalah membuat tombol show hide di postingan blog. Kegunaan dari tombol show hide ini adalah membuat tulisan posting tersembunyi dan untuk menampilkannya hanya dengan mengklik tombol show, begitu pula sebaliknya. Biasanya jika kalian menulis artikel yang sangat panjang, mungkin dengan menggunakan tombol show hide ini, artikel kalian akan semakin menarik dan tambah rapi. Jika artikel menarik dan rapi, pastinya para pengunjung akan sering-sering mampir ke blog kalian. Okelah tak perlu banyak bicara lagi, silahkan ikuti tutorialnya dibawah ini.


1. Masuk dulu ke blog kalian masing-masing.
2. Klik Buat Entri, lalu masukkan kode dibawah ini ke HTML bukan Compose
<div><div style="margin-bottom: 2px;"><b><small>Klik show untuk melihat</small></b>
<input value="Show" style="margin: 0px; padding: 0px; width: 60px; font-size: 10px;" 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'; }" type="button"></div>
<div style="border: 1px inset; margin: 0px; padding: 6px;"><div style="display: none;">
Masukkan tulisan kalian disini
</div></div></div>
3. Tulisan yang berwarna MERAH bisa diganti sesuai selera kalian masing-masing.
4. Maka jadinya akan seperti dibawah ini.
Klik show untuk melihat
Masukkan tulisan kalian disini

Cukup simple dan mudah bukan? Segera terapkan di blog kalian masing-masing. Jika kalian ada yang kurang paham dan masih ada yang belum mengerti, silahkan tulis keluhan kalian dikolom komentar dibawah.

Ikuti ANK’s Blog di twitter dan bergabunglah bersama kami di facebook untuk mendapatkan update informasi tentang  games, music, film, software, dll.




0 komentar:

Popular Posts

Visitor Conter

Flag Counter

Display

Display 0ne