fadeIn and fadeOut jQuery Methods

Following are some useful jQuery methods related to fading.

1. fadeIn method:

It is used to fade in a hidden HTML element.

The syntax is 

$(selector).fadeIn(speed,callback);

Here parameters speed & callback, both are optional. speed parameter takes the values like "slow", "fast" or milliseconds
while callback parameter is the name of a function to be executed after the fading completes.

Example:

$("button").click(function(){
$("#fadeInDiv1").fadeIn();
$("fadeInDiv2").fadeIn("slow");
$("fadeInDiv3").fadeIn("5000");
});

2. fadeOut method:

It is used to fade out a visible element.

The syntax is almost same as syntax of fadeIn method except the word fadeOut.

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

Here parameters speed & callback has same meaning as explained above.

Example:

$("button").click(function(){
$("#fadeOutDiv1").fadeOut();
$("fadeOutDiv2").fadeOut("slow");
$("fadeOutDiv3").fadeOut("8000");
});
Ebook Download
View all
Learn
View all