JQuery Easy UI Accordion (Scalable panel) component, jqueryaccordion

Source: Internet
Author: User

JQuery Easy UI Accordion (Scalable panel) component, jqueryaccordion

Accordion scalable panel component, based on panel, example:

<! Doctype html> 

Click here to download the source code


JQuery ui Accordion problem, can I open multiple at the same time, or is there any component in the UI that implements this function?

To use this plug-in ui. core. js and ui. accordion. js, these two js files are essential. Of course, jquery files are also required, as if they are nonsense.
1 option:
1.1 active this parameter sets the default option, which is 0 by default, that is, the first one. Haha.
Initialization setting example: $ ('# accordion'). accordion ({active: 2 });
Example of obtaining and setting after initialization:
// Obtain var active =$ ('# accordion '). accordion ('option', 'active'); // set $ ('# accordion '). accordion ('option', 'active', 2 );
1.2 The animation effect setting parameter is 'slide' by default'
You can set the animation effect you like or do not use the animation effect (set to false). Besides the default settings, you need to use the UI Effects Core to use 'bounceslide' and 'easeslide... Hey hey...
Initialization setting example: $ ('# accordion'). accordion ({animated: 'easeslide '});
Example of obtaining and setting after initialization:
// Obtain
Var animated = $ ('# accordion'). accordion ('option', 'animated ');
// Set
$ ('# Accordion'). accordion ('option', 'animated', 'easeslide ');
1.3 autoHeight is true by default. If it is set, the height of all content is set to the highest content. Initialization settings: $ ('# accordion'). accordion ({autoHeight: false });
Get or set after Initialization
// Obtain
Var autoHeight = $ ('# accordion'). accordion ('option', 'autoheight ');
// Set
$ ('# Accordion'). accordion ('option', 'autoheight', false );
1.4 clearStyle is false by default. It seems that the style is cleared. Haha ~~~
Initialization settings $ ('# accordion'). accordion ({clearStyle: true });
The obtained and set after initialization are similar to those above... Omitted...
1.5 by default, the 'click' option is used to expand an event. You can set long double-click, mouse slide, and so on...
Initialization setting example: $ ('# accordion'). accordion (event: "mouseover ");
For initialization settings, refer to the above, which is omitted here...
1.6 fillSpace: the height of the parent element. The default value is false. autoHeight is invalid if this parameter is used.
Initialization setting example: $ ('# accordi ...... remaining full text>
 
Dynamically add accordion of jquery ui

Of course,
Use $ ("# thidr"). append ("<tr> <td> 111 </td> </tr> ");
 

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.