Monday, 20 February 2012

TUTORIAL : BUTTON HIDE-SHOW SPOILER


hai korang.. sorry ye.. dua tiga hari ni cik N tak update blog sebab banyak sangat assignment.. pastu nak study cikit sebab nak fahamkan betul betul.. rase macam susah pulak topik baru akaun sem ni.. ape ape pun cik N tetap ade berlegar legar kat kawasan ni je balas komen korang jangan risau.. ehee.. *bajet ramai orang komen.. sedeh~ T.T*

harini cik N nak kongsi kan tuto untuk buat hide show spoiler sebab cik athirah juhari ni tanye cik N.. ^_^


cik N tukar si gojez jadi usha sini~ nampak tak kat sidebar tu??

 tak nampak?? korang ni saje kan.. ni haa.. cenggini haa.. hihi.. cube tekan.. kuar gambo kan?? banner kesayangan cik N tu..






ok tanpa membebel panjang.. ikut ni..

1) pergi ke DASHBOARD>DESIGN > PAGE ELEMENT > ADD A GADGET > HTML / JAVA script .. seperti dibawah.. ^_^

klik untuk besarkan mate korang..
*kalau rajin sume pun nak tunjuk ahahai*

2) copy code dibawah ye adik adik..
<center><div id="spoiler"><div><input value="♥ usha sini~ " style="width:88px ;font-size:12px;background-image: url(URL BACKGROUND);-moz-border-radius: 10px; border-radius: 10px;margin:13px;padding:0px;border-style: 2px solid #ff9fcc;" type="button" onclick="if (this.parentNode.parentNode.getElementsByTagName(&#39;div&#39;)[&#39;show&#39;].style.display != &#39;&#39;) { this.parentNode.parentNode.getElementsByTagName(&#39;div&#39;)[&#39;show&#39;].style.display = &#39;&#39;; this.parentNode.parentNode.getElementsByTagName(&#39;div&#39;)[&#39;hide&#39;].style.display = &#39;none&#39;; this.innerText = &#39;&#39;; this.value = &#39;Hide Spoiler!&#39;; } else { this.parentNode.parentNode.getElementsByTagName(&#39;div&#39;)[&#39;show&#39;].style.display = &#39;none&#39;; this.parentNode.parentNode.getElementsByTagName(&#39;div&#39;)[&#39;hide&#39;].style.display = &#39;&#39;; this.innerText = &#39;&#39;; this.value = &#39;Show Spoiler!&#39;; }" /><div id="show" style="display: none; background-color:transparent; background-repeat:repeat; margin: 0px;border-width:0px; padding:3px; width:90%"><center><center>
KOD ATAU PERKATAAN KORANG
</center></center></div></div></div></center> 


ungu: tukar denagn perkataan yang korang nak letak di button.. (picit, tekan, cth cik N ♥ usha sini~ )
merah: url background boleh cari sini..
hijau : tukar dengan kod atau perkataan yang korang nak munculkan bila button tu ditekan..


3) paste kan didalam kotak html script tadi ok?? nanti akan jadi macam bawah ni..


paste dalam kotak tau..

dah siap??  save dan preview kat blog jadi tak?? .. :)

sumber: lyssa secret





3 comments:

athirah juhari said...

thankss cik n.

✿ CIK N ✿ said...

@athirah juhari

same same ^_^

athirah juhari said...

@✿ CIK N ✿ cik n.. tempat letek komen nie tak de ke? hew3... buat la tuto..

Related Posts Plugin for WordPress, Blogger...
Bookmark |