Skip to main content

jQuery Slide Element Up/Toggle Up

By Sam Deering

JavaScript

Share:

Simple jQuery code snippet to slide page elements up or toggle up using jquery.slideToggle(). The difference is that jQuey’s slideUp() function is primarily used to slide elements out of view and then use slideDown() to make them reappear whereas jQuery’s toggleUp() function provide both this functionality within the same function call binded to the element.

SlideUp Example

$('#clickme').click(function() {
  $('#book').slideUp('slow', function() {
    // Animation complete.
  });
});

http://api.jquery.com/slideUp/

SlideToggle Example

$('#clickme').click(function() {
  $('#book').slideToggle('slow', function() {
    // Animation complete.
  });
});

http://api.jquery.com/slideToggle/

http://www.learningjquery.com/2009/02/slide-elements-in-different-directions

Sam Deering has 15+ years of programming and website development experience. He was a website consultant at Console, ABC News, Flight Centre, Sapient Nitro, and the QLD Government and runs a tech blog with over 1 million views per month. Currently, Sam is the Founder of Crypto News, Australia.

Integromat Tower Ad