cara membuat spoiler pada postingan (script spoiler)

membuat postingan disiang hari yang begitu panas dan menyengat, membuat dahaga terasa kering kelontang.. sesaat teringat ketika berdiri didepan gerbang kampus ditengah teriknya matahari sambil bersorak dan memporandakkan buah kata untuk kaum elite yang duduk dikursi nan empuk dalam ruangan sejuk yang cuacanya bisa diatur sedemikian mungkin, sebut saja itu air conditioner. itulah salah satu cara seseorang yang menganggap dirinya pejuang yang mempunyai idealisme tinggi. waduh, kok sampai mau nulis cerpen yah.. maaf sampai lupa topik tentang cara membuat spoiler pada postingan.

ok. lanjut gan.. nah terkadang pada waktu ingin membuat postingan/artikel kita ingin juga menampilkan gambar, kadang juga ada keinginan menampilkan gambar lebih dari satu, namun jika semua gambar yang ingin ditampilkan pada postingan kepanjangan kita bisa menggunakan script spoiler agar terlihat agak rapi.. contoh seperti pada postingan saya yang satu ini "Award dari Sahabat Blogger".. nah di situ ada dua gambar yang di hide dengan menggunakan script spoiler.. selain gambar cara ini juga bisa digunakan untuk hide tulisan atau script html.. kalau sahabat blogger mau script ini bisa langsung memanfaatkan konten lokal buatan indonesia yang di berikan oleh kawan ane di komunitas blogger maros.
berikut script spoiler..

<div>
<div style="margin: 5px;">
<div class="smallfont" style="margin-bottom: 2px;">
<i><span style="font-weight: bold;">Buka pelan-pelan ya.. </span></i><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 = 'Hide'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Show'; }" style="font-size: 10px; margin: 0px; padding: 0px; width: 60px;" type="button" value="Show" />
</div>
<div class="alt2" style="border: 1px inset; margin: 0px; padding: 6px;">
<div style="display: none;">
<br />
<br />
<br />
<center><img alt="title gambar" border="0" src="url gambar disini" /></center>
</div>
</div>
</div>
</div>
<br />
<br />
<div class="MsoNormal" style="line-height: 150%; margin-bottom: 0.0001pt; text-align: justify;">

silahkan cicipi dan edit sesukanya.. jika ada kesalahan dan tidak dimengerti silahkan berkomentar di kolom komentar.. terima kasih.

Visit Cara Membuat Blog (Khusus Pemula)