Wednesday, February 29, 2012

Cara Membuat Spoiler Pada Blog atau Hide Gambar dipostingan


Spoiler biasanya digunakan untuk memperkecil atau mempersingkat kode, postingan, tulisan, atau gambar apapun agar tidak terlalu memenuhi halaman.Spoiler ini dapat anda pasang pada side bar, halaman posting, header dan footer.Untuk membuatnya tidaklah sulit,anda tinggal mencopy kode dibawah ini.
Berikut contoh spoiler :

Spoiler Untuk lihat Script:

Isi Gambar, Tulisan atau apapun disini





Cara membuat spoiler ini adalah sebagai berikut:
1.Copy dan paste kode dibawah ini
<div style="margin: 5px 20px 20px;">
<div class="smallfont" style="margin-bottom: 2px;"><b>Spoiler</b> Untuk lihat <b>Script</b>: <input value="Lihat" style="margin: 0px; padding: 0px; width: 55px; font-size: 11px;" 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 = 'Lihat'; }" type="button">
</div>
<div class="alt2" style="border: 1px inset ; margin: 0px; padding: 6px;">
<div style="display: none;">

Isi Gambar, Tulisan atau apapun disini

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


2.Selanjutnya gantilah tulisan yang yang berhuruf tebal dan berwarna hitam dan merah.
Width: 55px adalah lebar kotak spoiler.Gantilah sesuai kebutuhan anda.
font-size: 11px adalah ukuran huruf dalan kotak spoiler.Dapat diganti sesuai kebutuhan.
Tutup dan Lihat dapat anda ganti sesuai keinginan anda
Isi kode script, HTML dan teks anda disini dapat anda ganti dengan teks atau kode script.

Silakan mencoba.



No comments:

Post a Comment

Comments system

Disqus Shortname

Disqus Shortname

Comments System

Disqus Shortname

Comments system