Recently, some plug-ins have been used in the project to create pages. Here we will share the use of jQueryUI, hoping to help new users. Download jQuery UI with source code at the end of the article
2 For My use
2.1 Tabs
2.2 Accordion
2.2.1 use basic Accordion
2.2.2 enable multiple tags
2.2.3 Accordion nesting
3. Apply Theme to the plug-in
3.1 change color
3.2 change the icon
4 related connections
JQuery UI
Sometimes you have to re-learn the javascrip and write a lot of code to achieve a gradient animation effect. Until the emergence of jQuery, developers are freed from a lot of tedious js Code, instead of several lines of jQuery code. Nowadays, jQuery has undoubtedly become one of the most popular JavaScript class libraries.
JQuery UI is a set of interface tools developed on the basis of jQuery, including the plug-ins and animation effects that you can think of and use on the webpage, it makes a dazzling interface for coders who only know the code word without any artistic sense. It allows you to use the interface as you like. Another point is that it is free and open-source, and users can customize or even redesign as needed.
2 For My use
The following describes how to use jQuery UI in a project using the Tabs and Accordion plug-ins. Detailed usage documents and demos of other plug-ins can be learned here, but only in English.
2.1 Tabs
Tabs plug-ins are widely used in web pages and desktop applications. They can be used as menus or Tabs for a small part of content.
First, create an MVC project in VS2010. To use jQuery UI, first include the jQuery and jQuery UI script files in the project, and reference the related pages with the script tag. After creating an MVC project, the system has automatically included jQuery and jQuery UI script files in the Scripts folder (1 ).
Figure 1
Note: In the figure, the jquery-1.5.1-vsdoc.js is a version that contains the complete prompt comment, and the prompt information and comment are intelligently displayed when writing code in VS; The jquery-1.5.1.js is the standard version; the compressed and simplified version with min is used to reduce the download time on the client. In general, we will use a streamlined version on the page, as long as the project folder contains the jquery-1.5.1-vsdoc.js, VS will automatically call the prompt information inside.
What you need to do now is to include it in the page. After creating a project. jQuery has been referenced to the page on the Mater page, which means that all pages that use the master page reference jQuery by default, therefore, on the index page, we only need to add a declaration for the jQuery UI file:
The Code is as follows: