Tombol Spoiler Blog | Hide And Show Code

Bagai mana cara membuat tombol spoiler / tombol hide show untuk melihat suatu code atau macam-macam yg akan kita sembunyikan . tombol ini berfungsi untuk menyingkat jumlah tulisan artikel yg terlalu memanjang ataupun hanya sekedar style .. terserah yg penting gak bikin ngejubel artikel postingan . breikut di bawah ini code spoiler silah kan copas .

<div> <div style="background-color: black; color: red; font-family: serif; font-size: 13px; line-height: 18px;"> <div> <div style="margin-bottom: 2px;"> <b><small>Klik show untuk melihat</small></b></span><br /> <span style="background-color: black; color: red; font-family: serif; font-size: 13px; line-height: 18px;"><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> </span><br /> <span style="background-color: black; color: red; font-family: serif; font-size: 13px; line-height: 18px;"><div style="border: 1px inset; margin: 0px; padding: 6px;"> <div style="display: none;"> </span><br /> <strike style="background-color: black; color: red; font-family: serif; font-size: 13px; line-height: 18px; margin-bottom: 0px; margin-left: 0px; margin-right: 0px; margin-top: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 0px; padding-top: 0px;">Masukkan tulisanmu di sini</strike><br /> <span style="background-color: black; color: red; font-family: serif; font-size: 13px; line-height: 18px;"></div> </div> </div>

Keterangan : Ganti tulisan (Masukan Tulisanmu Di Sini) atau hapus untuk di ganti dengan tulisan atau kode yang akan ditaruh atau ditempatkan pada spoiler.

Klik show untuk melihat

Masukkan tulisanmu di sini

Yang di atas adalah contoh sederhana tentang cara pembuatan tombol show hide di blog, selanjutnya bisa teman-teman kembangkan sendiri.

Description: Tombol Spoiler Blog | Hide And Show Code Rating: 4.5 Reviewer: Unknown - ItemReviewed: Tombol Spoiler Blog | Hide And Show Code