Negrionta Community
Energy Saving Mode Using CSS3

Move your mouse to go back to the page!
Gerakkan mouse anda dan silahkan nikmati kembali posting apa adanya

Copyright 2011 http://rizkymakkah.blogspot.com - All rights reserved
.

Senin, 18 Juli 2011

Cara membuat spoiler serbaguna

Cara membuat spoiler serbaguna dengan memanfaatkan kode HTML
Semakin banyak belajar, semakin banyak yang kita tahu, Semakin banyak yang kita tahu, semakin banyak yang kita lupa, Semakin banyak yang kita lupa, semakin sedikit yang kita tahu. Jadi kenapa kita sibuk belajar ..... he.. he... he...









Di bawah ini adalah contoh dara spoiler serbaguna,sobat bisa isi teks atau URL (image)

Contoh Judul Spoiler 1
JANGAN LUPA BERIKAN KOMENTAR !!!

Contoh Judul Spoiler 2
Di sini posting yang akan disembunyikan (bisa gambar, teks atau yang lain)



Langsung aja Copy Paste kode html di bawah ini:..
TERIMAKASIH...

<div style="width:350px;"><div class="bgsGR-boksSpoiler" align="center"><div style="margin:5px 10px;">
<span class="bgsGR-Spoiler">Judul Spoiler</span><br />
<input style="padding:2px 10px;margin-top:15px;font-weight:bold;font-size:16px;color:#990000; background:#00CCFF;" value="Show" 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"/></div>
<div style="float:left;margin:5px 0;"><div style="display:none;">


Di sini posting yang akan disembunyikan (bisa gambar, teks atau yang lain)


</div>
</div>

Semoga ini bermanfaat bagi sobat blogger..
post by: putramakkah

0 komentar:

Tempel Komentar

Putra Makkah © 2011 Template by:
Negrionta Community