jQuery fadeIn fadeOut fadeTo fadeToggle

jQuery fadeIn, fadeOut, fadeTo,fadeToggle


jQuery provides 4 methods to implement transparency effect in HTML.

MethodDescription
fadeInDisplay the matched elements by fading them to opaque.
fadeOutHide the matched elements by fading them to transparent.
fadeToAdjust the opacity of the matched elements.
fadeToggleDisplay or hide the matched elements by animating their opacity.

jQuery fadeIn, fadeOut, fadeTo,fadeToggle example:

$("p").fadeIn();

// Quickly fade in the paragraph in 200 milliseconds, and then pop up a dialog box
("p").fadeIn("fast",function(){
   alert("Animation Done."); 
 });
// Fade out slowly
$("p").fadeOut("slow");

// Adjust paragraph transparency to 0.66
$("p").fadeTo("slow", 0.66);

// Fades last paragraph in or out for 200 milliseconds, alert a message upon completion.
$( "p:last" ).fadeToggle( "fast", function() {
     alert("Animation Done.");
});
date2019-04-02 20:02:20 From:www.jquerypluginhub.com Author:JPH
Related Tags:
Comments

Leave a Reply

Your email address will not be published. Required fields are marked *