Gets or sets the expanding animation duration.

Code example

Initialize a jqxExpander with the expandAnimationDuration property specified.

$('#jqxExpander').jqxExpander({ width: '200px',expandAnimationDuration:350

                            });

Gets or sets the collapsing animation duration.

Code example

Initialize a jqxExpander with the collapseAnimationDuration property specified.

$('#jqxExpander').jqxExpander({ width: '200px',collapseAnimationDuration:350});

                        

Gets or sets expander's state (collapsed or expanded).

Code example

Initialize a jqxExpander with the expanded property specified.

$('#jqxExpander').jqxExpander({ width: '200px', expanded: true }); 

Gets or sets whether the expander is disabled.

Code example

Initialize a jqxExpander with the disabled property specified.

$('#jqxExpander').jqxExpander({ width: '200px', disabled: true }); 

Gets or sets the animation type. Possible values ['slide', 'fade', 'none'].

Code example

Initialize a jqxExpander with the animationType property specified.

$('#jqxExpander').jqxExpander({ width: '200px', animationType: "none" });

                        

Gets or sets header's position. Possible values ['top', 'bottom']

Code example

Initialize a jqxExpander with the headerPosition property specified.

$('#jqxExpander').jqxExpander({ width: '200px', headerPosition: "bottom"

                            }); 

Gets or sets user interaction used for expanding or collapsing the content. Possible values ['click', 'dblclick', 'mouseenter', 'none'].

Code example

Initialize a jqxExpander with the toggleMode property specified.

$('#jqxExpander').jqxExpander({ width: '200px', toggleMode: "none" }); 

Gets or sets header's arrow position. Possible values ['left', 'right'].

Code example

Initialize a jqxExpander with the arrowPosition property specified.

$('#jqxExpander').jqxExpander({ width: '200px', arrowPosition: "right" });

                        

Gets or sets whether header's arrow is going to be shown.

Code example

Initialize a jqxExpander with the showArrow property specified.

$('#jqxExpander').jqxExpander({ width: '200px', showArrow:false }); 

Gets or sets expander's height. Possible values - 'auto' and string like this 'Npx' where N is any Number.

Code example

Initialize a jqxExpander with the height property specified.

$('#jqxExpander').jqxExpander({ width: '200px', height:"auto" }); 

Gets or sets expander's width. Possible values - 'auto' and string like this 'Npx' where N is any Number.

Code example

Initialize a jqxExpander with the width property specified.

$('#jqxExpander').jqxExpander({ width: '200px', height:"auto" }); 

This event is triggered when the jqxExpander is going to be expanded.

Code example

Bind to the expanding event by type: jqxExpander.

$('#jqxExpander').bind('expanding', function () { // Some code here. });

                        

This event is triggered when the jqxExpander is expanded.

Code example

Bind to the expanded event by type: jqxExpander.

$('#jqxExpander').bind('expanded', function () { // Some code here. }); 

This event is triggered when the jqxExpander is going to be collapsed.

Code example

Bind to the collapsing event by type: jqxExpander.

$('#jqxExpander').bind('collapsing', function () { // Some code here. });

                        

This event is triggered when the jqxExpander is collapsed.

Code example

Bind to the collapsed event by type: jqxExpander.

$('#jqxExpander').bind('collapsed', function () { // Some code here. });

                        

Method which is collapsing the expander.

Code example

Invoke the collapse method.

$('#jqxExpander').jqxExpander('collapse'); 

Method used for expanding the expander's content.

Code example

Invoke the expand method.

$('#jqxExpander').jqxExpander('expand'); 

Setting content's height.

Code example

Invoke the setContentHeight method.

$('#jqxExpander').jqxExpander('setContentHeight', '200px'); 

This method is setting specific content to the expander's header.

Code example

Invoke the setHeaderContent method.

$('#jqxExpander').jqxExpander('setHeaderContent', 'Header'); 

This method is setting specific content to the expander.

Code example

Invoke the setContent method.

$('#jqxExpander').jqxExpander('setContent', 'Content'); 

Getting expander's content.

Code example

Invoke the getContent method.

var content = $('#jqxExpander').jqxExpander('getContent'); 

Getting expander's header content.

Code example

Invoke the getHeaderContent method.

var header = $('#jqxExpander').jqxExpander('getHeaderContent'); 

This method is disabling the expander.

Code example

Invoke the disable method.

var header = $('#jqxExpander').jqxExpander('disable'); 

This method is enabling the expander.

Code example

Invoke the enable method.

var header = $('#jqxExpander').jqxExpander('enable');