Cara Membuat Spoiler

Bookmark and Share



1. Cara membuat Spoiler tanpa warna background.
Kodenya adalah :
<div id="spoiler"> <div><input style="font-size: 11px; font-weight: bold; margin: 5px; padding: 0px;" onclick="if (this.parentNode.parentNode.getElementsByTagName('div')['show'].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')['show'].style.display = ''; this.parentNode.parentNode.getElementsByTagName('div')['hide'].style.display = 'none'; this.innerText = ''; this.value = ' Tutup '; } else { this.parentNode.parentNode.getElementsByTagName('div')['show'].style.display = 'none'; this.parentNode.parentNode.getElementsByTagName('div')['hide'].style.display = ''; this.innerText = ''; this.value = ' Lihat Lagi '; }" name="button" _cke_saved_name="button" type="button" value="CONTOH SPOILER TANPA WARNA BACKGROUND" /></div> <div id="show" style="border: 1px solid white; display: none; margin: 5px; padding: 2px; width: 98%;"> <p style="text-align: justify;">Cara membuat Spoiler tanpa warna background</p> </div><div id="hide"></div></div> 



2. Cara membuat Spoiler dengan border dan warna background.
Kodenya adalah :
 <div id="spoiler"> <div><input style="font-size: 11px; font-weight: bold; margin: 5px; padding: 0px;" onclick="if (this.parentNode.parentNode.getElementsByTagName('div')['show'].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')['show'].style.display = ''; this.parentNode.parentNode.getElementsByTagName('div')['hide'].style.display = 'none'; this.innerText = ''; this.value = ' Tutup '; } else { this.parentNode.parentNode.getElementsByTagName('div')['show'].style.display = 'none'; this.parentNode.parentNode.getElementsByTagName('div')['hide'].style.display = ''; this.innerText = ''; this.value = ' Lihat Lagi '; }" name="button" _cke_saved_name="button" type="button" value="CONTOH SPOILER DENGAN BORDER DAN WARNA BACKGROUND" /></div> <div id="show" style="border: 1px solid white; display: none; margin: 5px; padding: 2px; width: 98%;"> <div style="color: #000000; background: none repeat scroll 0% 0% #ebf3fb; border: 1px solid #aaccee; padding: 7px; margin: 0px;"> <p style="text-align: justify;">Cara membuat Spoiler dengan border dan warna background.</p> </div><div id="hide"></div></div>


Keterangan :

warna teks
background: #EBF3FB; = Ini untuk mengganti warna background
border: 1px solid #AACCEE; = Ini untuk ukuran dan warna border






{ 0 komentar... Views All / Send Comment! }

Posting Komentar