Intermediary transaction http://www.aliyun.com/zixun/aggregation/6858.html ">seo diagnose Taobao guest cloud host technology Hall
You have to admit, in recent years jquery in the foreground development class library stand out, more and more popular, as long as you do Web-related applications or web development, certainly more or less use of related functions. In recent Google Trends, we can see that since 2008, the use of the JQuery class library has grown at a geometric level, far from the rest of the JS class library behind, there are pictures as evidence:
In fact, jquery has become the most popular desktop JavaScript class library. And with the release of jquery Mobile, the mobile end will also show a strong development strength.
One of the most important reasons why jquery is so popular is the development of the community, where thousands of developers are involved in the innovative development of jquery, making jquery more powerful and more effective, and the development of Plug-ins makes the development of jquery show the momentum Many of the top jquery developers have made jquery a great success today.
In today's article, we present an example of the main features of jquery, along with demos, code, and online debugging, in the hope of helping you to actually understand and learn about jquery's capabilities.
Here use Jsfiddle to run the demo, you can easily view, javascript,css,html code, and can debug online
jquery processing CSS
Use the. css () method
Using jquery to process CSS is very handy to help you dynamically implement the interface design, for example, to achieve a zebra effect, in jquery we use the. css method to handle CSS-related operations, such as font, color, location, and so on.
Use the. addclass () and. Removeclass () method
Directly using the. CSS () method to deal with simple CSS is convenient, if you need to deal with complex CSS we'd better keep the CSS in an ID or class, and then call jquery's. addclass () or. Removeclass () method to process, This code is clearer and simpler.
Use the. Toggleclass () method
Toggleclass () can help you quickly switch the effects of CSS, in this example, you can click "Run CSS Demo" To switch applications and not apply CSS effect.
jquery handles effects and animations
Use the. Animate () method
Using jquery can quickly help us deal with effects and animations, and you can apply animation effects to elements in the DOM, such as moving, morphing, and so on. We typically use the. Animate () method to perform animation effects. Also offers a number of options to help you set related options, such as speed, callback method, etc.
Use the. Stop () method
In the animation process, if you need to terminate the animation, we can use the Stop () method, as follows:
Using the SetInterval () and Clearinterval () methods
In the animation implementation, we often need to take advantage of the Setinerval () method, which can help you to invoke the animation loop, we can use this to achieve an infinite loop animation effect. At the same time we can use Clearinterval () to clear the loop effect, as follows:
Using the settimeout () and cleartimeout () methods
Similar to the SetInterval () method, there is a settimout () method that allows you to delay an operation while using Cleartimeout () to terminate the delay operation.
Use the. Slidetoggle () and Fadetoggle () methods
Similar to. Toggleclass (), we can also use the Slidetoggle () and Fadetoggle () methods to control slide and fade, as follows:
Use the. Delay () method
The delay () method of jquery can produce the effect of a similar settimeout () method, as we have described in previous jquery code encyclopedia articles, the Hide () and show () methods must be taken with parameters.
Note that the above JS Code, hide () and show () method must take parameters, otherwise the following writing does not work:
$ (' #demo '). Show (). Delay. Hide ();
Please refer to: How to use Hide (), delay () and show () in chained operation?
Source: GBin1 Online example helps you better understand jquery features (i)