STATUS UPDATED!
FEEL FREE TO ASK~
Tutorial Blog ^_^: TUTORIAL: BUTTON SHOW-HIDE SPOILER VERSI BARU

Sekiranya anda berminat untuk membaca artikel Islam, info semasa, kisah nabi, kisah pengajaran dan lain-lain, bolehlah pergi ke Khaleefah Allah ^_^ Followlah blog ini dan blog itu sekiranya berbaloi untuk difollow. Sebarang ulasan adalah amat amat amat amat diharapkan.
Any Requests or Questions?

Jom, tukar link~

TUTORIAL: BUTTON SHOW-HIDE SPOILER VERSI BARU

22021432H
Assalamualaikum...

Button spoiler kali ini agak berbeza berbanding tutorial sebelum ini sebab kita boleh customise sendiri bentuknya. Tengok contoh di bawah.






Copy dan paste kod di bawah pada posting atau HTML/JavaScript.

<center><div id="spoiler"><div><input onclick="if (this.parentNode.parentNode.getElementsByTagName('div')['show'].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')['show'].style.display = ''; this.parentNode.parentNode.getElementsByTagName('div')['hide'].style.display = 'none'; this.innerText = ''; this.value = 'TUTUP'; } else { this.parentNode.parentNode.getElementsByTagName('div')['show'].style.display = 'none'; this.parentNode.parentNode.getElementsByTagName('div')['hide'].style.display = ''; this.innerText = ''; this.value = 'KLIK'; }" style="-moz-border-radius: 25px 10px / 10px 25px; background-image: url(URL BACKGROUND); border-radius: 25px 10px / 10px 25px; border-style: 1px solid #000000; font-size: 12px; margin: 10px; padding: 0px; width: 200px;" type="button" value="KLIK" />

<div id="show" style="display: none; background-color:transparent; background-repeat:repeat; margin: 0px;border-width:0px; padding:3px; width:98%">
MASUKKAN KOD JAVASCRIPT/GAMBAR/TEXT DI SINI
<div id="hide"></div></center>


Save.

*merah: tajuk anda
*oren: lebar spoiler
*hijau: url background anda
*biru cerah: ketebalan border
*ungu: jenis border, boleh tengok sini.
*biru gelap: kod warna, pilih warna.
*pink: kod javascript/gambar/text
3 Comments
Comments

3 comments:

  1. Assalamualaikum,,
    mcm mne nk msukkan gamba..sye bwt x menjadi pn...mohon ajarkan saya..

    ReplyDelete

 
Copyright © 2009-2012 Tutorial Blog ^_^: TUTORIAL: BUTTON SHOW-HIDE SPOILER VERSI BARU
Design by a.a.ghariib