Check out my code on CodePen: http://codepen.io/Chiz/pen/jbwPLO (click anywhere in the blank area)
I'm trying to figure out how to adjust the number of bounces a div makes before stopping. For example, I want the div to bounce 10 times and also change the speed of the bounce. The resources from JQuery UI are lacking information and examples on using easings and special easings in the animate() or slideDown() functions.
$("div").hide();
$(window).on("click", function() {
$("div").slideToggle(700, "easeOutBounce");
})div {
width: 300px;
height: 300px;
position: absolute;
bottom: 0;
background-color: gray;
display: none;
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/themes/smoothness/jquery-ui.css">
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js"></script>
<div></div>