Selasa, 15 September 2009

SPOILER

hasil dari walking² kali ini akyu dapetin trik spoiler. Aku juga gak tahu apa itu spoiler, soalnya pas nemuin trik ini juga judulnya kek gitooo :)). Sebenarnya semua trik itu bagus² kok, gimana kita mengembangkan trik² tersebut buat apaan. Seperti trik Expand/Collapse yang aku terapkan di bagian kanan blog aku. Ada juga trik yang mirip seperti itu yang dinamakan Hidden/Sidebar Widget. Intinya menyembunyikan apa yang mau kita sembunyiin kawan's, didalam postingan maupun tampilan Blog kita. Berexplorasilah dengan trik yang adanya seabreuk-abreuk :D. Waaa...ampir lupa pada hal pokoknya, si spoiler tea :P.

spoiler :





Tapi menurut aku mendingan jangan dibuka deh itu contoh si-spoilernya...gawaaaaat... :-o. Hehehe...masih bergelumit tentang menyembunyikan sesuatu kawan's ini trik spoiler. Yaaa mudah-mudahan ada gunanya buat kawan's. Kalo memang tertarik dengan trik ini, yuk kita tulis deh rumusnyah ;)).

<div style="margin: 5px;"><div class="bigfont" style="margin-bottom: 0px;"><input value="Buka" 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 = 'Tutup'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Buka'; }" type="button"><br></div><br><div class="alt2" style="border: 1px inset ; margin: 0px; padding: 5px; width: 100%; background-color: #xxxxxx"><div style="display: none;">--- TEKS, SCRIPT ATO APAPUN YANG MAU DISEMBUNYIKAN LETAKKAN DISINI ---
</div></div></div>


Bagaimana !!! Trik ini bisa digunakan sesusu, eh sesuai dengan kebutuhan kawan's...kalo mau add widget terus dimasukan rumusan trik ini gimana ??? Bereksplorasilah...bereksplorasilah...haha..ha..ha uyeee...uyeee :)
Width, height, dan color atur aja terserahsesuaikan dg kebutuhan
Kalo mau ngilangin bagian :
tinggal ilangin ajah bagian :
<div class="alt2" style="border: 1px inset ; margin: 0px; padding: 5px; width: 100%; background-color: #xxxxxx">
1px ganti jadi 0px, background-color: #xxxxxx hilangkan saja
Kode spoiler anyar...hihihi
<div class='benspoiler'><input type="button" value="Open Here" onclick="if (this.parentNode.nextSibling.childNodes[0].style.display != '') { this.parentNode.nextSibling.childNodes[0].style.display = ''; this.value = 'Close Please'; } else { this.parentNode.nextSibling.childNodes[0].style.display = 'none'; this.value = 'Open Here'; }" /></div><div><div class='spoiler' style="display: none;">Here content add here yaw...hohohoho!!!</div></div>

Spoiler gaya ala Wikipedia

Spoiler Title

Text Spoiler

<div style="padding: 5px; border:1px solid #ccc;background:#f9f9f9"><div style="margin-bottom: 0px;font-family: arial;font-size:12px;"><b>Spoiler Title</b><input value="Show" style="border:0px solid #000;margin:0px;color:#0000FF;font-family: arial; font-size: 12px; height:16; background:#f9f9f9" 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 style="margin: 0px; padding: 0px; border: 0px inset #fff;"><div style='display:none'><br/>Text Spoiler</div></div></div>
Tamat ah, males mo nambahin apa lagi juga. GOOD LUCK

Tidak ada komentar:

Posting Komentar