Skip welcome & menu and move to editor
Welcome to JS Bin
Load cached copy from
 
<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script>
<meta charset=utf-8 />
<title>JS Bin</title>
</head>
<body>
  <div class="content">
    <p>Item One</p>
    <p>Item Two</p>
    <p>Item three</p>
  </div>
  <button>Toggle</button>
</body>
</html>
 
.content {
  overflow: hidden;
  transition: max-height 1.4s cubic-bezier(0, 1, 0, 1);
    -webkit-transition: max-height 1.4s cubic-bezier(0, 1, 0, 1);
  max-height: 0;
}  
.open {
  max-height: 1000px;
  transition: max-height 1s ease-in-out;    
}
 
$("button").click(function () {
     $(".content").toggleClass("open");
});
Output

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
Egorbypro
0viewers