jQuery proper slideDown/Up

© @e.teiks

by psycketom

HTML

<div id="trigger">trigger</div>

<div class="test"></div>

CSS

#trigger{
  padding:10px
}
.test{
  width:100px;
  height:500px;
  background-color:#000;
  display:none;
}

JavaScript

$(document).ready(function(){
  var isSlidingDown = 0;
  var isSlidingUp = 0;
  $('#trigger').hover(function(){
    if(isSlidingUp == 1){
      $('.test').stop().animate(
        {height:500+'px'},
        "fast"
      );
      
    }
    
    else if(isSlidingDown == 0){
      isSlidingDown = 1;
      $('.test').slideDown('slow',function(){
        isSlidingDown = 0;
      });
    }
    
    else{
      isSlidingDown = 0;
    }
  },function(){
    isSlidingUp = 1;
      $('.test').slideUp('slow',function(){
        isSlidingUp = 0;
      });
  });
});