jQuery Effect fadeOut()Methods

Examples

Use the fade-out effect to hide all <p> elements:

$("button").click(function(){ $("p").fadeOut(); });

The fadeOut() method gradually changes the opacity of the selected elements, from visible to hidden (fade-out effect).

Note:Hidden elements are not displayed (they no longer affect the page layout).

Tip:This method is usually used together with thefadeIn()method.

$(selector).fadeOut(speed,easing,callback)

Parameters	Description
speed	Optional. Specifies the speed of the fade effect. Possible values: Milliseconds "slow" "fast"
easing	Optional. Specifies the speed of the element at different points in the animation. The default value is "swing". Possible values: "swing" - moves slowly at the beginning/end, moves quickly in the middle "linear" - moves at a constant speed Tip:The extension plug-in provides more available easing functions.
callback	Optional. The function to execute after the fadeOut() method has completed. To learn more about callback, please visit ourjQuery Callbackchapter.

Parameters

Description

speed

Optional. Specifies the speed of the fade effect.

Possible values:

easing

Optional. Specifies the speed of the element at different points in the animation. The default value is "swing".

Possible values:

Tip:The extension plug-in provides more available easing functions.

callback

Optional. The function to execute after the fadeOut() method has completed.

To learn more about callback, please visit ourjQuery Callbackchapter.

fadeOut() - Using the speed parameter
How to use the speed parameter to specify the speed of the fade effect.

fadeIn() - Using the callback parameter
How to use the callback parameter when gradually changing the opacity of the selected elements.

Other Extensions