Monday 26 September 2011

Butang Buka Dan Tutup - Expand

Dah lame gak x update blog...kali ni aku nak share tutorial untuk membuat button yang boleh manimize dan maximize teks atau code korang..so tak la serabut blog korang nanti..contoh button tu korang leh lihat di bawah ini:
















TEKS ATAU KOD ANDA DISINI





1.Copy (Ctrl+C) code kat bawah ni:

<div>
<div style="margin: 5px;">
<div class="normalfont" style="margin-bottom: 2px;">
<input value="OPEN" style="margin: 0px; padding: 5px;
width: 100%;
font-size: 12px;
font-weight:bold;
background:red;
color:white;
border:1px dashes yellow;

-moz-border-radius-topright: 15px;
-moz-border-radius-topleft: 15px;
-moz-border-radius-bottomright: 15px;
-moz-border-radius-bottomleft: 15px; " 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 = 'CLOSE'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'OPEN'; }" type="button" /></div>
<div class="alt2">
<div style="display: none;">
<div style="border: 2px dashes white; color:blue;background-color:NONE; text-align: justify; padding:10px; ">
<center>

LETAK CODE, TEKS ATAU GAMBAR ANDA DISINI

</center>
</div>
</div>
</div>
</div>
</div>
2. Pergi Dashboard > Design > Page Element > Add a Gadget > HTML/JAVASCRIPT
3. Paste (Ctrl+V) pada  ruang HTML/JAVASCRIPT tu.
4. Gantikan:
= MERAH - TEKS, CODE ATAU GAMBAR
= OREN - LEBAR ( CONTOH: width: 120%; )
= HIJAU - SAIZ TULISAN  ( CONTOH: font-size: 15px; )
= KUNING - WARNA LATARBELAKANG
= BIRU - WARNA TULISAN
= MERAH - TITLE

P/s: Korang juga boleh menggunakan Code ini pada posting korang (Dashboard > Posting > Edit HTML)

No comments:

Post a Comment