Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

jQuery: toggle('slow') animation from top down?

In my code I use jQuery's toggle('slow') animation to make a hidden div appear/disappear. It expands from the upper left to the bottom right.

How can I make it expand from the top towards the bottom, instead (no left-to-right growth)?

like image 940
bevanb Avatar asked Aug 24 '12 03:08

bevanb


People also ask

What is toggle () in jQuery?

The toggle() method attaches two or more functions to toggle between for the click event for the selected elements. When clicking on an element, the first specified function fires, when clicking again, the second function fires, and so on. Note: There is also a jQuery Effects method called toggle().

How do you toggle slideUp and slideDown in jQuery?

jQuery slideToggle() Method The slideToggle() method toggles between slideUp() and slideDown() for the selected elements. This method checks the selected elements for visibility. slideDown() is run if an element is hidden. slideUp() is run if an element is visible - This creates a toggle effect.

What does slideDown do in jQuery?

Definition and Usage The slideDown() method slides-down (shows) the selected elements. Note: slideDown() works on elements hidden with jQuery methods and display:none in CSS (but not visibility:hidden). Tip: To slide-up (hide) elements, look at the slideUp() method.

How do you animate a slide in jQuery?

jQuery slideToggle() Method$(selector). slideToggle(speed,callback); The optional speed parameter can take the following values: "slow", "fast", milliseconds. The optional callback parameter is a function to be executed after the sliding completes.


2 Answers

You could use .slideToggle('slow').

The working demo.

like image 62
xdazz Avatar answered Sep 22 '22 19:09

xdazz


Try .slideDown('slow'). Note that this will only work for sliding down (to reveal) and sliding up (to hide). For anything more complex, you're looking for .animate(...) or something from jQuery UI.

like image 35
Cat Avatar answered Sep 19 '22 19:09

Cat