JavaScript
Article
By Sam Deering

jQuery Slide Element Up/Toggle Up

By Sam Deering
Last chance to win! You'll get a... FREE 6-Month Subscription to SitePoint Premium Plus you'll go in the draw to WIN a new Macbook SitePoint 2017 Survey Yes, let's Do this It only takes 5 min

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/

--ADVERTISEMENT--

SlideToggle Example

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

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

Demo

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

Login or Create Account to Comment
Login Create Account
Recommended
Sponsors
Get the most important and interesting stories in tech. Straight to your inbox, daily.
Is it good?Is it good?