Properties

autoWidth boolean false

Sets or gets whether the Timeline is with auto width in horizontal mode.

Code example:

autoWidth is set to true

$('#myTimeline').jqxTimeline({autoWidth: true});

collapsible boolean true

Sets or gets whether the items can be collapsed.

Code example:

collapsible is set to true

$('#myTimeline').jqxTimeline({collapsible: true});

disabled boolean false

Sets or gets whether the Timeline is disabled.

Code example:

disabled is set to true

$('#myTimeline').jqxTimeline({disabled: true});

horizontal boolean false

Sets or gets whether the Timeline is horizontal.

Code example:

disabled is set to true

$('#myTimeline').jqxTimeline({horizontal: true});

position string both

Sets or gets position.

The possible values are 'near', 'far' and 'both'.

Code example:

$('#myTimeline').jqxTimeline({position: near});

source [] []

Sets or gets the items. Each item should be an object. The object has the following properties: date: date, description: string, subtitle: string, css: string, dotCSS: string, title: string and icon: string.

Code example:

Sets or gets the items

$('#myTimeline').jqxTimeline({source: [{ date: 'May 15, 2024', description: 'Flight: Reserving airline tickets', subtitle: 'May 15, 2024', title: 'Flight Reservation', icon: 'material-icons flight', dotCSS: '' }]});

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.

Code example:

theme is set to 'material'

$('#myTimeline').jqxTimeline({theme: material});

Events

Methods

render Method

Re-renders the timeline.

Parameters
Name Type Description
None null

Return Value
[]

AltStyle によって変換されたページ (->オリジナル) /