Selasa, 27 September 2011

Cara Membuat Spoiler

Pada postingan kali ini akan dijabarkan tentang membuat spoiler, adapun wujud dari spoiler ini adalah kolom tersembunyi yang bisa difungsika dengan cara membuka konten serta menutup konten yang ada dalam spoiler tersebut.

Tujuan dari membuat spoiler ini adalah, untuk memperkecil muatan dalam ruang blog kita. Serta dapat mempercepat loading blog kita, karena spoiler dapat menunda loading item-item seperti Gambar serta video yang memiliki kapasitas yang besar hingga spoiler tersebut dibuka.

Berikut ini contoh dari spoiler :




Contoh Spoiler :


Nah...jika tertarik untuk menggunakannya, silakan copy code dibawah ini :

<center><div><div style="margin: 5px;">
<div class="smallfont" style="margin-bottom: 2px;"><i>
<span style="font-weight: bold;">Contoh Spoiler : </span></i>
<input value="Klik Disini" style="margin: 0px; padding: 0px;
width: 200px; font-size: 10px;" 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 Lagi Dong'; }
else { this.parentNode.parentNode.getElementsByTagName('div')
[1].getElementsByTagName('div')
[0].style.display = 'none'; this.innerText = ''; this.value = 'Klik disini'; }"
type="button"/> </div>
<div class="alt2" style="border: 0px inset ; margin: 0px; padding: 0px;">
<div style="display: none;">
simpan file gambar/video/dll disini 
</div></div></div></div></center>

Jika anda mengerti tentang html, silakan ganti code-code yang berwarna merah sesuai selera anda.

Semoga  bisa bermanfaat
Terima Kasih