JQuery library have all the effects for adding animation as discussed in earlier article. How to show or hide an element, sliding effects on an element or perform any custom animation on web-page have been discussed in my previous discussion.
Wherever these function didn’t work on the page then there may be some script error or you are defining the function with wrong syntax. Whatever the error be, jQuery library is there for help any type of definition, syntaxes or any example.
User can apply fading on an element, and make that element out of visibility, by using below functions specially created for this functionality. Reading an element’s description and do some practical with them are two different tasks. So just read and perform practical to clarify all these effects.
These methods have some parameters like speed, callback and opacity as per their requirements. Below are the examples for above methods:
$(".divEmployee").fadeIn(“slow”); or $(".divEmployee").fadeIn(4500);
$(".divEmployee").fadeOut(“slow”); or $(".divEmployee").fadeOut(4500);
$(".divEmployee"). fadeToggle (“slow”); or $(".divEmployee"). fadeToggle (4500);
$(".divEmployee"). fadeTo("slow",0.5);
$(".divEmployee").stop();
This function will stop the effect applied on specified element and revert back. If the element is hidden and perform a show() function then it will stop and make that hidden back.
Stop() function may take two parameters stopAll (to clear animation queue, default it will only stop the active animation) and goToEnd (to specify whether complete the current animation or not).
We will discuss about callback feature of these functions means what to do after animation has finished.
Wherever these function didn’t work on the page then there may be some script error or you are defining the function with wrong syntax. Whatever the error be, jQuery library is there for help any type of definition, syntaxes or any example.
User can apply fading on an element, and make that element out of visibility, by using below functions specially created for this functionality. Reading an element’s description and do some practical with them are two different tasks. So just read and perform practical to clarify all these effects.
- fadeIn(): used to fade in a hidden element on the web-page.
- fadeOut(): used to fade out a hidden element on the web-page.
- fadeTo(): allows fading to a given opacity.
- fadeToggle(): used to toggle between fadeIn() and fadeOut() methods alternatively.
These methods have some parameters like speed, callback and opacity as per their requirements. Below are the examples for above methods:
$(".divEmployee").fadeIn(“slow”); or $(".divEmployee").fadeIn(4500);
$(".divEmployee").fadeOut(“slow”); or $(".divEmployee").fadeOut(4500);
$(".divEmployee"). fadeToggle (“slow”); or $(".divEmployee"). fadeToggle (4500);
$(".divEmployee"). fadeTo("slow",0.5);
Stop()
This method is used to stop all the effects before it is finished and revert back to the previous stage. It can work with all effects function e.g. hide/show, slideDown/slideUp, fadeIn/fadeOut or any custom animation.$(".divEmployee").stop();
This function will stop the effect applied on specified element and revert back. If the element is hidden and perform a show() function then it will stop and make that hidden back.
Stop() function may take two parameters stopAll (to clear animation queue, default it will only stop the active animation) and goToEnd (to specify whether complete the current animation or not).
We will discuss about callback feature of these functions means what to do after animation has finished.