Jquery dynamic cool effect implementation Summary

Jquery has a strong advantage in making dynamic cool effects. The following are some of the most common methods I have summarized.

1. Modify inline CSS
The jqyerypolic.css () method is used to obtain or modify the inline CSS.
. The CSS () method can receive two parameters. One is to pass a separate style attribute and value for it, the other is to pass a ing composed of "property-value" pairs for it:
. CSS ('properties', 'value ');
. CSS ({'property1': 'value1', 'Property-2': 'value2 '});
Generally, numeric values do not need to be enclosed by quotation marks, while string values must be enclosed by quotation marks. However, when the ing notation is used, if the attribute name uses Dom notation in the case of camper, quotation marks can be omitted.

2. Basic hiding and display without animated effects
. Hide ()
. Show ()
These two methods are used to immediately hide or display a set of matched elements.
3. Hide and display the display speed
Based on the. Hide () and. Show () methods, you can set the hidden or display speed. Its representation is. Hide ('speed') or. Show ('speed '). The speed value can be:
Slow, normal, fast; slow is 0.6 seconds; normal is 0.4 seconds; fast is 0.2 seconds
Number of milliseconds

4. Fade-in and fade-out effect

. fadein () specifies the fade-in effect for the Matching Element
. fadeout () specifies the fade-out effect for the Matching Element
use. fadein () or. fadeout () can also be used to specify the speed value, such as slow, normal, fast, and milliseconds.
the fade-in and fade-out implementation method actually increases or reduces the opacity of matching elements.
5. animation effects
jquery provides a powerful tool. you can use the animation () method to create a custom animation that contains multiple effects .. The animate () method accepts the following four parameters:
A ing containing style attributes and values.
an optional speed parameter. The default value is normal.
optional easing type
optional callback parameters.
6. use. problems to consider when creating an animation
restrictions imposed by CSS on the elements we want to change
for example, when the CSS positioning of an element is not set to relative or absolute, adjusting the left attribute does not work for the matching element. The default CSS positioning attribute of all block-level elements is static. This value indicates that the elements will only remain static when they are moved before they are changed.
concurrency and queuing effect
In jquery, both processing one group and multiple groups of elements occur simultaneously by default. Therefore, concurrency has become a problem worth consideration. To sum up, there are two points:
if you are dealing with a group of elements, you can control them according to the sequence of Code ;
if you are processing multiple groups of elements, you can use the callback function to control them.