jQuery Tutorials
jQuery Introduction
jQuery Get Started
jQuery Syntax
jQuery Selectors
jQuery Events
jQuery Effects
jQuery Hide/Show
jQuery Fade
jQuery Slide
jQuery Animate
jQuery stop()
jQuery Callback
jQuery Chaining
jQuery HTML
jQuery Get
jQuery Set
jQuery Add
jQuery Remove
jQuery CSS Classes
jQuery Traversing
jQuery Traversing
jQuery Ancestors
jQuery Descendants
jQuery Siblings
jQuery Filtering
jQuery AJAX
jQuery AJAX Intro
jQuery Load
jQuery Get/Post
jQuery Misc
jQuery noConflict()
jQuery Filters
Previous
jQuery Effects - Sliding
jQuery Sliding Methods
With jQuery you can create a smooth effect on objects.
jQuery has the following slide methods:
slideDown()slideUp()slideToggle()
jQuery slideDown() Method
The jQuery slideDown() method is used to slide an object.
Syntax:
Optional speed parameter specifies the duration of the output. It can take the following values: "slow", "fast", or milliseconds.
Optional callback parameter is a function to be used after you have finished sliding.
The following example illustrates slideDown() method:
Example
$("#panel").slideDown();
});
jQuery slideUp() Method
The jQuery slideUp() method is used for sliding over an object.
Syntax:
Optional speed parameter specifies the duration of the output. It can take the following values: "slow", "fast", or milliseconds.
Optional callback parameter is a function to be used after you have finished sliding.
The following example illustrates slideUp() method:
Example
$("#panel").slideUp();
});
jQuery slideToggle() Method
The jQuery slideToggle() method switches between slideDown() and slideUp() modes.
If the elements are slipped down, slideToggle() will slide upwards.
If the elements slide up, slideToggle() will slide down.
Optional speed parameter can take the following values: "slow", "fast", milliseconds.
Optional callback parameter is a function to be used after you have finished sliding.
The following example illustrates slideToggle() method:
Example
$("#panel").slideToggle();
});