Selamat datang NEWBIEHOUSE. Semoga apapun yang saya share disini, bermanfaat bagi IT Loverz semua... SALAM SUKSES !!!

Cara membuat Spoiler di Blog

 
Selamat sore IT Loverz, kali ini saya akan memberikan tutorial sederhana tentang "Cara membuat Spoiler di Blog" Mungkin IT Loverz kebanyakan sudah banyak yang tau, tapi disini saya share hanya untuk Nubienya saja hehehehe.... IT Loverz pasti sudah tidak asing lagi dengan fungsi Spoiler. Ya ! Yaitu menyembunyikan suatu postigan maupun widget, agar menghemat tempat. Contohnya seperti di bawah ini :
Klik show untuk membuka :
Isi spoiler,bisa berupa gambar,teks atau video.
OK tidak perlu berlama-lama. Kita mulai Tutor kali ini. Tutor : Cara membuat spoiler di Blog Caranya simple banget. IT Loverz hanya perlu meng-copast script di bawah ini ke postingan atau widget blog IT Loverz :
<div> <div style="margin: 4px;"> <div class="smallfont" style="margin-bottom: 2px;"> <i><span style="font-weight: bold;">Klik show untuk membuka gan</span></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;"> Isi spoiler,bisa berupa gambar,teks atau video. </div> </div> </div> </div>
Jika sudah langsung simpan, dan lihat hasilnya. Semoga bermanfaat yah :-D

Semoga bermanfaat. Salam sukses untuk IT Loverz

0 komentar:

Posting Komentar