JQuery makes a summary of the dynamic cool effect

JQuery is an excellent JavaScript framework that can effectively solve the compatibility problems of different browsers, especially under ASP. net mvc.

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 () to specify the speed value, such as slow, normal, fast, and millisecond.

The implementation method of Fade-in and fade-out is to increase or decrease the opacity of matching elements.

5. Make the animation effect

JQuery provides a powerful. animate () method that allows you to create custom animations that contain multiple effects .. The animate () method accepts the following four parameters:

A ing that includes style attributes and values.
Optional. The default value is normal.
Optional easing type
Optional callback parameters.

6. Questions to consider when using. animate () to create an animation

Css restrictions on the elements we want to change

For example, if the css position 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 becomes a problem worth consideration. In summary, there are two points:

If you are dealing with a group of elements, you can control them according to the order of the Code;

If you are processing multiple groups of elements, you can use the callback function to control them;

Author: Shen Shan laolin
Source: http://wlb.cnblogs.com/