jquery, Showing a hidden item with a fadeIn

Question

in jquery, how can I show a hidden div, and make it fade in?

Answer 1

$("selector_for_your_div").fadeIn("slow");

For your edification, documentation for all of the bundled jQuery animation effects / tools is located at:
http://api.jquery.com/category/effects/

See: Jquery Documentation for fadeIn()

Answer 2

Just hide the element initially, ether with .hide() or style="display: none;" (or display: none; in the stylesheet). Then, just call .fadeIn(), like this:

$("#elementID").fadeIn();

The .fadeIn() call automatically removes the display: none when it fades the opacity to 100%, it won't remove visibility: hidden; so don't use this, or you'll have to remove it manually.

Answer 3

Use fadeIn():

$('#hiddendiv').fadeIn();

You may change the duration of the fadein:

$('#hiddendiv').fadeIn(1000); // 1000 ms

Answer 4

Use fadeIn

$("selector").fadeIn();

Display the matched elements by fading them to opaque.

To hide it back anytime, you can use:

Note that you should initially hide it using css or jquery.

fadeOut

Answer 5

selector.fadeIn(speed in miliseconds) is the function your looking for.

If you want the div to retain its space when its not seen use style="opacity:0;" instead of display:none;