Tutorial Cara Buat Button Show-Hide Spoiler

 

Hasil selepas di klik...

Hai all...Semalam koz dah ajar "Cara Buat Button Untuk Blog",jadi hari ini koz akan ajar benda yang sama tapi hasilnya lain.Button Spoiler ini fungsinya adalah untuk menyimpan isi sesuatu post,JavaScript atau gambar caranya lebih kurang seperti Hide/Show Shoutbox yang koz ada buat tutorial sebelum ini.

Sebagai contoh seperti berikut:-

Pengunaan spoiler untuk widget di JavaScript

Mari Cuba Mana Tahu Dapat Tingkatkan Pengunjung Di Blog Korang^^

Penggunaan Spoiler untuk Text/posting
Hai all...Semalam koz dah ajar "Cara Buat Button Untuk Blog",jadi hari ini koz akan ajar benda yang sama tapi hasilnya lain.

Button Spoiler ini fungsinya adalah untuk menyimpan isi sesuatu post,JavaScript atau gambar caranya lebih kurang seperti Hide/Show Shoutbox yang koz ada buat tutorial sebelum ini.blablablabla....

Penggunaan Spoiler untuk gambar

Cuba teka..gambar apakah ini??

Sudah paham?jadi berikut adalah langkah-langkahnya...

Langkah 1

Copy dan paste code di bawah pada JavaScrip/Posting

<div><div style="margin: 5px;">
<div style="margin-bottom: 2px;" class="bigfont"><input style="margin: 0px; padding: 0px; width: 95px; " value="Pamirkan" 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 = 'Pamirkan'; }" type="button"/>
</div>
<div style="border: 0px inset ; margin: 0px; padding: 6px;" class="alt2">
<div style="display: none;">

Masukkan Code JavaScript/Gambar/Text Di sini

</div></div></div></div>

Langkah 2

Pada code berwarna merah korang boleh ubah ayat "Pamirkan" kepada ayat yang korang nak(fungsi sebelum spoiler di buka)
Pada code berwarna hijau korang boleh ubah ayat "Tutup" kepada ayat yang korang nak(fungsi selepas spoiler di buka)
Pada code berwarna biru korang letak code JavaScript,gambar atau text yang korang nak.

Save dan Lihat hasilnya...

Camat mencuba...

Artwork...(Kekesalan...)

Hai all...petang ini koz tak ada tutorial untuk di kongsikan,maybe esok...jadi sebagai penganti koz nak pamirkan hasil seni yang koz hasilkan 10 minit ini...

artwork ini koz hasilkan menggunakan macromedia flash 8...reka watak nya koz hasilkan mengikut mood koz yang koz hadapi sekarang...sekian...

Tutorial Cara Memasang Widget Translate Google Di Blog

Hai all...okey tutorial berikutnya.Koz nak ajar korang cara nak pasang Widget Translate Google dekat blog korang.Kalau korang nak tahu...Widget ini amatlah penting di pasang di blog korang kerana ia juga salah satu cara untuk korang meningkatkan trafik korang bukan sahaja di dalam malaysia ,malah di negara asing juga...Sebagai contoh tiga hari selepas koz memasang Widget ini di blog koz ini ...



Langkah-langkah pemasangannya amat mudah...

Langkah 1

Layout>Page Elements>Add a Gadget>HTML/Javascript

Langkah 2

Copy dan paste code di bawah

<center><div id="google_translate_element"></div><script>
function googleTranslateElementInit() {
new google.translate.TranslateElement({
pageLanguage: 'ms'
}, 'google_translate_element');
}
</script><script src="http://translate.google.com/translate_a/element.js?cb=googleTranslateElementInit"></script></center>

Kemudain save dan lihat hasilnya...

Camat mencuba...