CODEWITHSUNDEEP
jqueryslideup
Greg
Greg

Reputation: 567

How to make SlideUp stop at acertain height

I'm using a slideUp and slideDown plugin. I was wondering how i can make it so the div only slide ups to a certain height.

Second question How can I make my the same button the target for the div to slide up and down?

Here's what I m currently trying to use

$(document).ready(function() {

  $("#toggle").click(function(){
     $("#Menu").slideDown( 'slow', function(){ 
         $(".log").text('Slide Down Transition Complete');
      });
  });

  $("#toggle").click(function(){
     $("#Menu").slideUp('slow', function(){ 
         $(".log").text('Slide Up Transition Complete');
      });
  });

});

Upvotes: 2

Views: 9458

Answers (2)

Kato
Kato

Reputation: 40582

   $("#toggle").click(function(){
      var down = $('#Menu').css('height') == '100px';
      if( down ) {
         $('#Menu').animate( {height: '500px'}, 'slow', function(e) {
            $(".log").text('Slide Down Transition Complete');
         });
      }
      else {
         $('#Menu').animate( {height: '100px'}, 'slow', function(e) {
            $(".log").text('Slide Up Transition Complete');
         });      
      }
   });

Upvotes: 1

timing
timing

Reputation: 6455

In this case you could create a custom animation for slideUp. Let's say you want to slideUp to a height of 20px: 

$("#toggle").click(function(){
    $("#Menu").animate({height: 20}, 'slow', function(){ 
        $(".log").text('Slide Up Transition Complete');
    });
});

Upvotes: 2

Related Questions