|
|
| Name |
Type |
|
animationType
|
object
|
Sets or gets the animation type.
Possible values:
"fade"
"slide"
"none"
|
|
animationDelay
|
object
|
Sets or gets the duration of the ribbon animation.
|
|
disabled
|
bool
|
Enables/disables the ribbon.
|
|
height
|
object
|
Sets or gets the ribbon's height.
|
|
initContent
|
object
|
Initializes the content of jqxRibbon. Useful for initializing other widgets.
|
|
mode
|
object
|
Sets or gets the ribbon's display mode.
Possible values:
"default" - the ribbon's content is included in its height.
"popup" - the ribbon's content is not included in its height and is positioned absolutely. It overlaps elements underneath it.
|
|
popupCloseMode
|
object
|
Sets or gets the way to close selected content sections when the mode property is set to "popup".
Possible values:
"click"
"mouseLeave"
"none"
|
|
position
|
object
|
Sets or gets whether the ribbon's header is positioned at the top, bottom, left or right of the content.
Possible values:
"top"
"bottom"
"left"
"right"
|
|
reorder
|
bool
|
Sets or gets whether the ribbon's tabs can be reordered.
|
|
rtl
|
bool
|
Sets or gets a value indicating whether widget's elements are aligned to support locales using right-to-left fonts.
|
|
selectedIndex
|
double
|
Sets or gets the selected index (tab).
|
|
selectionMode
|
object
|
Sets or gets the selection mode.
Possible values:
"click"
"hover"
"none"
|
|
scrollPosition
|
object
|
Sets or gets the position of the scrollbar buttons.
Possible values:
"both"
"near"
"far"
|
|
scrollStep
|
double
|
Sets or gets the scroll step.
|
|
scrollDelay
|
double
|
Sets or gets the scroll delay.
|
|
theme
|
string
|
Sets the widget's theme.
- Include the theme's CSS file after jqx.base.css.
The following code example adds the 'material' theme. <link rel="stylesheet" href="../../jqwidgets/styles/jqx.base.css"type="text/css"/>
<link rel="stylesheet" href="../../jqwidgets/styles/jqx.material.css" type="text/css" />
- Set the widget's theme property to 'material' when you initialize it.
$('#jqxRibbon').jqxRibbon({ theme: 'material' });
|
|
width
|
object
|
Sets or gets the ribbon's width.
|
|
|
|
onChange
|
Event
|
This event is triggered when the user selects or unselects an item.
|
|
onReorder
|
Event
|
This event is triggered when the user reorders the jqxRibbon items with the mouse.
|
|
onSelect
|
Event
|
This event is triggered when the user selects an item.
|
|
onUnselect
|
Event
|
This event is triggered when the user unselects an item.
|
|
|
| Name |
Arguments |
Return Type |
|
addAt
|
(double index, object item)
|
void
|
Adds a new item by index.
- index - number;
- data - object with the following properties:
- title - string;
- content - string.
|
|
clearSelection
|
()
|
void
|
Unselects the selected item and collapses its content.
|
|
disableAt
|
(double index)
|
void
|
Disables an item by index. Index is a number.
|
|
destroy
|
()
|
void
|
Destroys the jqxRibbon widget.
|
|
enableAt
|
(double index)
|
void
|
Enables a disabled item by index. Index is a number.
|
|
hideAt
|
(double index)
|
void
|
Hides an item by index. Index is a number.
|
|
removeAt
|
(double index)
|
void
|
Removes an item from the ribbon. Index is a number.
|
|
render
|
()
|
void
|
Renders the jqxRibbon widget.
|
|
refresh
|
()
|
void
|
Refreshes the jqxRibbon widget.
|
|
selectAt
|
(double index)
|
void
|
Selects the item with indicated index. Index is a number.
|
|
showAt
|
(double index)
|
void
|
Shows an item by index. Index is a number.
|
|
setPopupLayout
|
(double index, object layout, object width, object height)
|
void
|
Sets the layout of an item's content if mode is set to "popup".
- index - number;
- layout - string, possible values:
- "default" - the item's content is aligned with the widget's header;
- "near" - the item's content is left/top aligned with its title;
- "far" - the item's content is right/bottom aligned with its title;
- "center" - the item's content is centered under/next to its title.
- width - number/string;
- height - number/string.
|
|
updateAt
|
(double index, object item)
|
void
|
Updates an item.
Note: after an item has been updated with updateAt, initContent will be called again for that item (if set).
- index - number;
- newData - object with the following properties:
- newTitle - string;
- newContent - string.
|
|
val
|
[SET] (string value) [GET] ()
|
[SET] void [GET] string
|
Sets or gets the selected index. Index is a number.
|