Sabtu, 26 Juni 2010

Cara bikin spoiler "pencet", "tutup"


3:15:00 PM |

Siang JEBLOGERS, salam blogging!!!

Ininih UJIB bikin khusus buat temen baru yang ramah plus asik banget namanya Kurnia.
Jadi gini, kalo di postingan Ujib tuh kan kalo gambar ada yang tulisannya pencet trus kalo udah dipencet ada tulisan tutup. Nah,,,, gimana sih cara bikinnya? Banyak kan yang bertanya - tanya kan? Entah dalam hati ataupun secara langsung. Oke,, Ujib bakal bagi - bagi ilmu nih buat JEBLOGERS semua.

Contohnya kayak gini,

Nah cara bikinnya kayak gini nih...
Kopas kode berikut,
<div align="justify" style="margin: 2px 5px 5px;"><div class="smallfont" style="margin-bottom: 2px;"><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 = 'Tutup'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Pencet'; }" style="margin: 0px; padding: 5px; width: auto;" type="button" value="Pencet" /></div><div class="alt2"><div style="display: none;"><div style="border: medium none; padding: 8px; text-align: justify;">

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

Trus tarok "hal" yang ingin disembunyikan diantara kode yang banyak tersebut diantara kode ini. Contoh lagi nih...
<div align="justify" style="margin: 2px 5px 5px;"><div class="smallfont" style="margin-bottom: 2px;"><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 = 'Tutup'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Pencet'; }" style="margin: 0px; padding: 5px; width: auto;" type="button" value="Pencet" /></div><div class="alt2"><div style="display: none;"><div style="border: medium none; padding: 8px; text-align: justify;">

Nama saya
</div></div></div></div>


Tulisan tutup pencetnya bisa diganti sesuka hati...
Final result ato hasil akhirnya,
Nama saya




You Might Also Like :


10 cuapan:

Suratman Adi mengatakan...

Pertama pa bukan ya...Test dulu ah

Suratman Adi mengatakan...

Mantap boz info nya...aq juga mau copaz ah...

Reddish Pink mengatakan...

Makasih, Bang! hehe.. Abang baik! Makasih ya tutorialnya.. ^^ Aku coba ya!

Kurnia ^^ mengatakan...

Makasih, Bang! hehe.. Abang baik! Makasih ya tutorialnya.. ^^ Aku coba ya!

Ujib mengatakan...

@Wong Sikampuh: Selamat SOBAT pertama.... Silahkan dipake nggak bayar.. hehe,,

Ujib mengatakan...

@Azura: Sama - sama dek...

Ujib mengatakan...

@Kurnia: Sama - sama...

Ujib mengatakan...

Azura sama Kurnia sama ya..

AzHis Jhie mengatakan...

kok ada pop-upnya ya klw pas dipencet...??

nice tips gan dan salam kenal....

Ujib mengatakan...

@Azhis: Yaps, sama - sama GAN, thanks udah berkunjung ke blog Ane yang sederhana ini...

Posting Komentar