Home » » Cara Membuat Spoiler di Halaman posting

Cara Membuat Spoiler di Halaman posting

Written By Unknown on Sabtu, 21 April 2012 | 11.16

Cara Membuat Spoiler di Halaman posting - Jika kemaren kita sudah membicarakan cara membuat scrolbox dihalaman posting, posting kali ini tentang cara mebuat spoiler atau tombol hide. Spoiler ini sendiri digunakan untuk menyembunyikan artikel atau posting itu sendiri. Biasanya adalah gambar atau video, dengan tujuan untuk mengurangi beban saat loading. Car amembuat spoiler itu sendiri sangat mudah, hampir sama dengan membuat scrol box. cuma kode yang dipasang tentunya lain. dan ini langkah langkah cara mebuatnya.
1. Buat postingan seperti biasa dulu.
2. Pindah ke edit HTML pada Posting.(sebelumnya ada di COMPOSE)
3. Tambahkan kode ini pada awal bagian yang akan di sembunyikan

 <div style="margin: 5px 20px 20px;">
<div class="smallfont" style="margin-bottom: 2px;">
<b>JUDUL</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 = 'Tutup'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Buka'; }" style="font-size: 12px; margin: 0px; padding: 0px; width: 55px;" type="button" value="Buka" /></div>
<div class="alt2" style="border: 1px inset; margin: 0px; padding: 6px;">
<div style="display: none;">
<br />




Ket :  Silahkan Ganti Tulisan yang berwarna biru Dengan Judul yang anda inginkan
4. Tutup dengan </div></div></div> pada akhir bagian yang disembunyikan
5. Selesai dan pindah ke Compose lagi lalu terbitkan

Silahkan lihat contoh dibawah ini.

CR7:

Partisipasi KARTINI buat Para Wanita indonesia. Hehehe

 Nah,Itulah tadi Cara Membuat Spoiler di Halaman posting. Semoga brmanfaat.



Share this article :

2 komentar:

Posting Komentar

Berkomentarlah dengan baik dan relevan. No Spam.!!

Deskripsi Iklan
Deskripsi Iklan
Deskripsi Iklan
Deskripsi Iklan
Advertise Now!
 
Support : About Me | Contact Us | Privacy Policy
Copyright © 2013. Belajar Blog - All Rights Reserved
Template Created by Creating Website Published by Mas Template
Proudly powered by Blogger