Saturday

Cara Membuat Spoiler Keren

Selamat datang di Blog taharonqi.blogspot.com, kali ini saya akan sedikit berbagi tentang bagaimana cara membuat spoiler, sudah pada tahu kan kegunaan spoiler, kalau ada yang belum tahu kegunaan spoiler itu apa, spoiler itu dapat menyembunyikan sesuatu baik itu sebuah teks, gambar, widget dan lain-lain. Jika sobat pengen mengerti bagaimana hasilnya nanti berikut demonya :

Percobaan Tahar Onqi:
Masukkan Isi Spoiler Disini

Gimana keren kan sobat??
Spoiler ini dapat sobat taruh dimana saja, seperti yang saya lakukan spoiler ini saya taruh pada sebuah postingan. Copas kode dibawah ini dan taruh dimana sobat inginkan

<div style="padding: 10px; border:1px solid #ccc;background:#ffffff">
<div style="margin-bottom: 2px;"><b>Percobaan Tahar Onqi:</b>
<input value="Buka" style="border:0px solid #000;margin:0px; width: 60px;color:#fff; font-size: 10px; height:20px; background:#323c47" 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'; }" type="button"> </div>
<div style="margin: 10px; padding: 0px; border: 0px inset #fff;">
<div style='display:none'>Masukkan Isi Spoiler Di sini</div>
</div>
</div>
Keterangan :
Tulisan warna merah  : Ganti judul spoiler sesuai keinginan sobat
Tulisan warna kuning : Ganti dengan isi dari spoiler yang sobat inginkan

Mungkin itu saja yang dapat saya bagi, semoga bisa bermanfaat bagi sobat-sobat semua dan jika tinggalkan komentar demi kemajuan blog ini, terima kasih.

2 comments: