Cara membuat spoiler

Posting saya kali ini adalah...Cara membuat spoiler. Apa kalian tau sobat blogger apa itu spoiler. Spoiler adalah cara untuk menyembunyikan seluruh atau sebagian isi dari konten blog kita. Spoiler juga bermanfaat agar konten yang berat seperti gambar dalam ukuran besar dan video tidak diload sebelum menekan tombol show. Dengan kata lain spoiler membantu kita mengurangi waktu load konten blog dan memberikan pilih kepada pembaca blog untuk membuka atau tidak isi spoiler. Dibawah ini adalah kode dan contoh spoiler :


kode spoiler:

<div><div style="margin: 5px;">

<div class="smallfont" style="margin-bottom: 2px;"><i><span style="font-weight: bold;">Tentang bla..bla.bla.. </span></i><input value="Show" style="margin: 0px; padding: 0px; width: 60px; " 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 class="alt2" style="border: 1px inset ; margin: 0px; padding: 6px;">

<div style="display: none;">

isi spoiler...

</div></div></div></div>

kode di atas akan menjadi seperti ini :

Contoh Spoiler

iSI Spoiler.....bla...bla...bla....

Langkah selanjutnya COPY kode diatas buat entri baru masukan html.


SEMOGA BERMANFAAT

| Sumber |