jQuery SlideToggle() Method

Last Updated Jul 21, 2015, 12:00:06 PM





jQuery SlideToggle() Method

Before you understand about the jquery slideToggle() method try to understand how jquery slideDown method slideUp method works.



jQuery slideToggle() method makes the selectedHTML elements to display or hide with a sliding motion. Meaning it toggles between jQuery slideDown and jQuery slideUp methods.

Syntax

If the selected element is slide down, slideToggle() will slide it up. If slide up, slideToggle() will slide it down.

The following example illustrates usage of slideToggle(). In this example the ‘div’ element will be hidden or displayed by calling .slideToggle( "slow", function(){}) method. where slow indicates duration.

Example
Output
jquery slidetoggle method
Try It Now

Other Advanced jQuery Effects you might want to learn
jQuery Effects

jQuery Basic Effects

jQuery Fading Effects

jQuery Sliding Effects

jQuery Custom Effects

Sources and Credits

The content and methods in the tutorial has been referred and updated with jQuery API and The jQuery Foundation

Last Updated Jul 21, 2015, 12:00:06 PM