RodeBlog - Coding Galau kali ini akan mempostingkan cara Membuat Tombol Hide dan Show di Blog. Bagi yang biasa membaca website Kaskus pasti sudah biasa melihat ini , tetapi apakah anda ridak penasaran bagaimana cara membuat icon tersebut ? Kebanyakan website - website sekarang menggunakan ini dengan coding
Jquery . Akan tetapi postingan saya kali ini berbeda , Saya hanya mengunakan prinsip hide show yang sederhana saja . Tombol Hide dan Show ini dapat kalian gunakan dalam pos dan widget . Caranya ? caranya cukup dengan menggunakan coding dibawah ini :
Code :
<div><div style="margin-bottom:
2px;"><i><b><small>Coba di
Klik</small></b></i><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;">
TULISAN, LINK ATAU URL GAMBAR BISA DILETTAKKAN DISINI
</div></div></div>
Hasil :
NB: tombol show hide hanya bisa didemokan setelah posting di publikasikan .
