Jquery Effects

elements:
$(“button”).click(function(){
$(“#div1”).delay(“slow”).fadeIn();
$(“#div2”).delay(“fast”).fadeIn();
});

dequeue() Execute the next function on the queue for the matched elements.

Example:

Remove the next function from the queue, and then execute the function:
$(“div”).queue(function(){
$(“div”).css(“background-color”,”red”);
$(“div”).dequeue();
});

fadeIn() Fades in the selected items

Example:

Fade in all

elements:
$(“button”).click(function(){
$(“p”).fadeIn();
});

fadeOut() Hide the matched items by fading them to transparent.

Example:
Fade out all

elements:
$(“button”).click(function(){
$(“p”).fadeOut();
});

fadeTo() Fades in/out the selected items to a given opacity

Example:
Gradually change the opacity of all

elements:
$(“button”).click(function(){
$(“p”).fadeTo(1000,0.4);
});

fadeToggle() Display or hide the matched items by animating their opacity.

Example:
Toggle between fading in and fading out different boxes:
$(“button”).click(function(){
$(“#div1”).fadeToggle();
});

finish() Stop the currently-running animation, remove all queued animations, and complete all animations for the matched items.

Example:
Finish the currently running animation:
$(“#complete”).click(function(){
$(“div”).finish();
});

hide() Hide the selected items

Example:

Hide all

elements:
$(“button”).click(function(){
$(“p”).hide();
});

queue() Show or manipulate the queue of functions to be executed on the matched items.

Example:
Display the length of a queue in a element:
$(“span”).text(div.queue().length);

show() Shows the selected elements
Display the matched elements.

Example:
Show all hidden

elements:
$(“button”).click(function(){
$(“p”).show();
});

slideDown() Display the matched items with a sliding motion means Slides-down.

Example:
Slide-down (show) all hidden

elements:
$(“button”).click(function(){
$(“p”).slideDown();
});

slideToggle() Toggles between the slideUp() and slideDown() methods

Example:
Toggle between slideUp() and slideDown() for all

elements:
$(“button”).click(function(){
$(“p”).slideToggle();
});

slideUp() Hide the matched elements with a sliding motion.

Example:
Slide-up (hide) all

elements:
$(“button”).click(function(){
$(“p”).slideUp();
});

stop() Stops the currently running animation for the selected items

Example:
Stop the currently running animation:
$(“#stop”).click(function(){
$(“div”).stop();
});

toggle() Toggles between the hide() and show() methods
show or hide the matched items.

Example:

Toggle between hide and show for all

elements:
$(“button”).click(function(){
$(“p”).toggle();
});