Tutorial Blogspot
Spoiler banyak digunakan untuk menyembunyikan gambar yang beresolusi tinggi dan juga sebuah Script yang panjang serta sering digunakan untuk menyembunyikan sebuah widget sehingga dapat mempercepat loading halaman web atau blog. Untuk membuatnya adalah dengan meletakkan script dibawah ini didalam postingan atau di widget HTML.

Pernah lihat forum Kaskus ?, nah semacam itulah spoiler yang akan kita buat sekarang, bisa dengan Open/Hide, atau bisa diganti dengan Buka/Tutup, terserah bagaimana selera anda masing-masing saja.

Langsung saja copy code dibawah ini dan paste di postingan atau juga bisa di widget HTML anda.

Script spoiler adalah sbb :

<div style="margin: 5px 20px 20px;"><div class="smallfont" style="margin-bottom: 2px;">
    <b>Nama Spoiler</b>: <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 = 'Open Again'; }" style="font-size: 11px; margin: 0px; padding: 0px; width: 70px;" type="button" value="Open" /></div>
    <div class="alt2" style="border: 1px inset; margin: 0px; padding: 6px;">
    <div style="display: none;">
    Isi dengan Foto
    atau tulisan yang akan ditambahkan

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

Catatan : ganti tulisan yang berwarna merah sesuai dengan keinginan anda dan ganti tulisan "Open" dan "Hide" serta "Open Again" diatas dan ganti dengan selera anda.

Hasilnya akan tampak seperti di bawah ini :

Nama Spoiler:
Isi dengan Foto atau tulisan yang akan ditambahkan
Kalau di kaskus hanya ada Open/Hide saja, maka di spoiler ini ada Open/Hide dan Open Again pertanda jika sudah sekali membuka dan ingin membuka kembali... :D :D

Demikianlah saja Cara Mudah Membuat Spoiler Lebih Menarik dari Kaskus Di Blogspot ini semoga dapat dimengerti dan bermanfaat....

0 komentar:

Post a Comment

 
Top