Hai all...hari ini koz akan ajar korang cara membuat spoiler versi kedua dari koz...sebelum ini koz ada ajarkan cara membuat spoiler versi pertama...korang boleh lihat di SINI...Perbezaan versi kedua ini adalah ia kelihatan lebih kemas dan teratur...
Spoiler adalah gabungan kode HTML dan javascript yang bertujuan untuk menyimpan atau menyembunyikan widget blog , kumpulan teks , isi posting dan lain-lain...spoiler juga bertujuan untuk mempercepat loading pada posting blog dan cara membuatnya cukup senang...contohnya korang boleh lihat di bawah
copy paste kode ini:
Apa macam...okey tak? kalau berminat nak cuba buat korang bolehlah copy code di bawah dan paste di bahagian HTML code...code ini boleh digunakan di bahagian sidebar,posting dan javascript...
<div style="margin: 5px 20px 20px;"> <div class="smallfont" style="margin-bottom: 2px;"> <b>copy paste </b> <i>kode ini</i>: <input 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 = 'Hide'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Show'; }" style="font-size: 10px; margin: 0px; padding: 0px; width: 60px;" type="button" value="Show" /></div> <div class="alt2" style="border: 1px inset; margin: 0px; padding: 6px;"> <div style="display: none;">Ada sedikit perubahan harus dilakukan pada code berwarna merah,korang boleh menggantikannya mengikut ayat yang korang suka dan pada code berwarna biru korang boleh meletakkan teks,gambar atau code html di ruangan berkenaan...
isi teks/gambar / kode html
</div> </div> </div>
Selamat mencuba...
