Demo JQuery .show(), .hide() dan .toggle()

by Taufik Nurrohman

HTML

<button>Buka!</button>
<div id="panel">Lorem ipsum</div>

CSS

body {
  padding:30px;
}

#panel {
  background-color:#9D0053;
  height:160px;
  padding:5px;
  margin:10px 0 0;
  display:none;
}

JavaScript

$('button').toggle(function() {
    $(this).text('Tutup!');
    $('#panel').slideDown();
}, function() {
    $(this).text('Buka!');
    $('#panel').slideUp();
});