Spoiler Buka Tutup Elegan

<style type="text/css">

/*

Juli 2011 :: Taufik Nurrohman

Visit: http://hompimpaalaihumgambreng.blogspot.com

*/

#paneltovik {display:block}

#panel {

  background-color:#00BAFF;

  border:2px solid #00D0FF;

  border-width:2px 2px 0 2px;

  height:250px;

  overflow:auto;

  margin:0;

  padding:10px;

  color:#111;

  font:normal 12px Times,Serif;

  -webkit-box-shadow:inset 0 0 7px #222;

  -moz-box-shadow:inset 0 0 7px #222;

  box-shadow:inset 0 0 7px #222;

  display:none;

}

.tombolpanel {

  cursor:pointer;

  text-shadow:1px 1px 2px #000;

  padding:7px 15px;

  background-color:#333;

  border-top:3px solid #00D0ff;

  color:#e5e5e5;

  text-align:center;

  font:bold 14px Times,Sans-Serif;

  font-style:italic;

  -webkit-box-shadow:0 -1px 2px #222;

  -moz-box-shadow:0 -1px 2px #222;

  box-shadow:0 -1px 2px #222;

  -webkit-border-radius:0 0 14px 14px;

  -moz-border-radius:0 0 14px 14px;

  border-radius:0 0 14px 14px;

}

</style>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript"></script>

<script type="text/javascript">

$(document).ready(function() {

    $('.tombolpanel').click(function() {

        $('#panel').slideToggle('slow');

        $('.tombolpanel span.in').toggle();

    });

});

</script>

<div id="paneltovik">

  <div id="panel">

    ... KONTEN DI SINI ...

  </div>

  <div class="tombolpanel">

    <span class="in">Buka Panel</span>

    <span class="in" style="display:none;">Tutup Panel</span>

  </div>

</div>

Buka Panel Tutup Panel

Hai sob apakabar semua...?? mudah - kalian semua baik2 aja yah dan ada dalam lindungan Allah SWT, artikel kali ini saya akan memberitahukan cara tentang Spoiler BUKA/TUTUP yang cantik. Cara pasang :
1. Login Blogger
2. Tataletak
3. Add HTML/Javascript
4. Copy CODE Javascript dibawah
 5. lalu paste, dan save. Lihat Hasilnya disini :
 NB :  - Kode warna MERAH ganti dengan konten atau tulisan anda