9

Do slideUp('slow') and hide('slow') result in the same animation effects?

Example Code:

$(document).ready(function(){
  $("#hide").click(function(){
    $("p").hide('slow');
  });
  $("#show").click(function(){
    $("p").show('slow');
  });
});


<p>If you click on the "Hide" button, I will disappear.</p>
<button id="hide">Hide</button>
<button id="show">Show</button>
isherwood
  • 58,414
  • 16
  • 114
  • 157
Ben
  • 25,389
  • 34
  • 109
  • 165

3 Answers3

21

No.

.slideUp('slow') animates the height and vertical padding to zero.
.hide('slow') also animates the width, horizontal padding, and opacity to zero.

To see the difference, paste javascript:void($('pre').hide(4000)) in the address bar in this page.

SLaks
  • 868,454
  • 176
  • 1,908
  • 1,964
4

The animation is a little different, - slideUp('slow') basically slides up, nothing else :) - hide('slow') slides up and left at the same time.

In jquery API doc you have good documentation:

Pizzicato
  • 1,473
  • 1
  • 16
  • 32
0
$(function(){
        $(".job-bottom").hide();
        $(".job-top").click(function(){
            $(".job-bottom").slideUp('slow')
            $(this).next(".job-bottom").slideToggle( "slow" );
        });
    });
Kamlesh Kumar
  • 1,632
  • 2
  • 21
  • 31