Membuat Spoiler di Postingan Blog

Spoiler pada Forum Kaskus.co.id

Halo para pembaca . . . Apa kabar ??Kalau baik Allhamdulillah kalau lagi kurang baik semoga menjadi baik.Amiin.Kali saya mau memposting tentang bagaimana membuat spoiler di postingan Blog seperti yang ada di kaskus.Tahu Spoiler kan ?Jadi Spoiler itu adalah suatu cara untuk menyembunyikan suatu tulisan atau gambar, kemudian kita bisa munculkannya kembali.Prinsipnya seperti menyimpan pakaian dalam lemari.Bingung ya ??So, dari pada bingung langsung lihat contohnya saja

Spoiler tulisan

judul spoiler :

Begini nih yang dinamakan spoiler :D

Spoiler gambar

judul spoiler :

Nah biasanya Spoiler juga digunakan untuk menghemat tempat atau bandwith internet.Karena Selama Spoiler belum dibuka, isi yang ada dalam Spoiler tersebut tidak ikut terakses.Cara buatnya itu pake script.Saya sendiri tidak hafal dengan scripnya .Jadi saya tinggal copas Script yang sudah jadi dan tinggal mengimprove saja hehe.Ok langsung saja

<div style="margin: 5px 20px 20px;"><div class="smallfont" style="margin-bottom: 2px;">judul spoiler : <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 = 'TUTUP'; } else { this.parentNode .parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0] .style.display = 'none'; this.innerText = ''; this.value = 'BUKA'; }" style="font-size: 12px; margin: 0px; padding: 0px; width: 60px;" type="button" value="BUKA" /></div><div class="alt2" style="border: 2px inset; margin: 0px; padding: 6px;"><div style="display: none;">sisipkan gambar atau text yang akan di buat spoiler disini<br /> </div></div></div>

Copy Scripts diatas lalu Ubah pada "Judul Spoiler" dan "Sisipkan gambar atau yang akan di buat spoiler disini" sesuai dengan keinginan kalian.Jika kalian ingin menambahkan gambar pada Spoiler maka tambahkan Script berikut pada tulisan merah

<center><img src="url gambar"></center>

Oke cukup segitu saja.Kalau ada yang belum jelas silahkan tanya di kolom komentar :)

Sumber Script : depermana-share.blogspot.com

materi Terkait