Ensiklopedia Doktor Chenta

Friday, 3 February 2012

tutorial spoiler button

hai u all!! arini dengan rasminya cik eiyqa nak ajar korang buat spoiler button..jom ikot!

Step 1
Copy code di bawah ni dan paste di javascript atau posting korang.
<div><div style=”margin: 5px;”>
<div style=”margin-bottom: 2px;”><input style=”margin: 0px; padding: 0px; width: 95px; ” value=”Buka” 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”/>
</div>
<div style=”border: 0px inset ; margin: 0px; padding: 6px;”>
<div style=”display: none;”>
Letak Kod JavaScript/Gambar/Text kat sini
</div></div></div></div>
Step 2
  1. Ubah perkataan ‘Buka‘ kepada perkataan atau ayat yang korang nak. [paparan sebelum spoiler dibuka]
  2. Ubah perkataan ‘Tutup‘ kepada perkataan atau ayat yang korang nak. [paparan selepas spoiler dibuka]
  3. Ubah ayat yang berwarna merah kepada code javascript, gambar atau teks posting korang.
Itu saja. Selamat mencuba ya!

No comments: