[TIPS & TRICKS] Cara Mudah Buat Spoiler di Artikel Web / Blog

[TIPS & TRICKS] Cara Mudah Buat Spoiler di Artikel Web / Blog

Spoiler Kaskus

Buat yang kenal Kaskus pasti ga asing dengan kata "Spoiler", fungsinya menyembunyikan artikel atau gambar agar mengurangi bobot bandwith. Cara buatnya, gampang aja gan....

Sisipin aja script berikut :

<span style="background-color: yellow;"><b><br /></b></span>
<span style="background-color: yellow;"><b>&lt;div style="margin: 5px 20px 20px;"&gt;&lt;div class="smallfont" style="margin-bottom: 2px;"&gt;&lt;b&gt;&lt;em&gt;Judul spoiler&lt;/em&gt;&lt;/b&gt; : &lt;input value="Show" style="margin: 0px; padding: 0px; width: 60px; font-size: 10px;" 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'; }" type="button"&gt; &lt;/div&gt;&lt;br /&gt;&lt;div class="alt2" style="margin: 0px; padding: 6px; border: 1px inset;"&gt;&lt;div style="display:none;"&gt;</b></span><br />
&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; <br />
<br />
[ISI SPOILER]<br />
<br />
&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; <br />
<span style="background-color: yellow;"><b>&nbsp;&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;</b></span>

Hasilnya kek gini...

Agan tinggal ganti aja tuh tulisan "Judul spoiler" sama judul artikel/gambar yang mau diumpetin :D
Selesai ^_^

Spoiler Kaskus

Buat yang kenal Kaskus pasti ga asing dengan kata "Spoiler", fungsinya menyembunyikan artikel atau gambar agar mengurangi bobot bandwith. Cara buatnya, gampang aja gan....

Sisipin aja script berikut :

<span style="background-color: yellow;"><b><br /></b></span>
<span style="background-color: yellow;"><b>&lt;div style="margin: 5px 20px 20px;"&gt;&lt;div class="smallfont" style="margin-bottom: 2px;"&gt;&lt;b&gt;&lt;em&gt;Judul spoiler&lt;/em&gt;&lt;/b&gt; : &lt;input value="Show" style="margin: 0px; padding: 0px; width: 60px; font-size: 10px;" 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'; }" type="button"&gt; &lt;/div&gt;&lt;br /&gt;&lt;div class="alt2" style="margin: 0px; padding: 6px; border: 1px inset;"&gt;&lt;div style="display:none;"&gt;</b></span><br />
&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; <br />
<br />
[ISI SPOILER]<br />
<br />
&nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; &nbsp;&nbsp;&nbsp; <br />
<span style="background-color: yellow;"><b>&nbsp;&lt;/div&gt;&lt;/div&gt;&lt;/div&gt;</b></span>

Hasilnya kek gini...

Agan tinggal ganti aja tuh tulisan "Judul spoiler" sama judul artikel/gambar yang mau diumpetin :D
Selesai ^_^