jQuery Tutorials
jQuery Introduction
jQuery Get Started
jQuery Syntax
jQuery Selectors
jQuery Events
jQuery Effects
jQuery Hide/Show
jQuery Fade
jQuery Slide
jQuery Animate
jQuery stop()
jQuery Callback
jQuery Chaining
jQuery HTML
jQuery Get
jQuery Set
jQuery Add
jQuery Remove
jQuery CSS Classes
jQuery Traversing
jQuery Traversing
jQuery Ancestors
jQuery Descendants
jQuery Siblings
jQuery Filtering
jQuery AJAX
jQuery AJAX Intro
jQuery Load
jQuery Get/Post
jQuery Misc
jQuery noConflict()
jQuery Filters
Previous
jQuery Effects - Fading
jQuery Fading Methods
With jQuery you can blur the feature inside and out visually.
jQuery has the following fade methods:
fadeIn()fadeOut()fadeToggle()fadeTo()
jQuery fadeIn() Method
The jQuery fadeIn() method is used to blur a hidden object.
Syntax:
Optional speed parameter specifies the duration of the output. It can take the following values: "slow", "fast", or milliseconds.
The re-dialing parameter you choose is the function to be used after the blurring.
The following example illustrates the fadeIn() method with different parameters:
Example
$("#div1").fadeIn();
$("#div2").fadeIn("slow");
$("#div3").fadeIn(3000);
});
jQuery fadeOut() Method
The jQuery fadeOut() method is used to turn off an object.
Syntax:
Optional speed parameter specifies the duration of the output. It can take the following values: "slow", "fast", or milliseconds.
The re-dialing parameter you choose is the function to be used after the blurring.
The following example illustrates the fadeOut() method with different parameters:
Example
$("#div1").fadeOut();
$("#div2").fadeOut("slow");
$("#div3").fadeOut(3000);
});
jQuery fadeToggle() Method
The jQuery fadeToggle() method switches between fadeIn() and fadeOut() methods.
If features are blurred, fadeToggle() will blur in the middle.
If features are blurred, fadeToggle() will blur them.
Syntax:
Optional speed parameter specifies the duration of the output. It can take the following values: "slow", "fast", or milliseconds.
The re-dialing parameter you choose is the function to be used after the blurring.
The following example illustrates the fadeToggle() method with different parameters:
Example
$("#div1").fadeToggle();
$("#div2").fadeToggle("slow");
$("#div3").fadeToggle(3000);
});
jQuery fadeTo() Method
The jQuery fadeTo() method allows blur to a given opacity (value between 0 and 1).
Syntax:
The required speed parameter determines the length of the result. It can take the following values: "slow", "fast", or milliseconds.
The blurring parameter required in the fadeTo() method specifies the blurring in the given blurring area (value between 0 and 1).
The optional call parameter is a function to be used after completion of the task.
The following example illustrates the fadeTo() method with different parameters:
Example
$("#div1").fadeTo("slow", 0.15);
$("#div2").fadeTo("slow", 0.4);
$("#div3").fadeTo("slow", 0.7);
});