jQuery Roadmap
Another timeline jquery plugin. This plugin was custom made for another project and then separated.
Install
- NPM:
npm install jquery-roadmap
- CDN: jsdelivr.com
- Download: zip
Usage
-
Include jQuery:
-
Include plugin's code:
-
Call the plugin:
;
Parameters
Data
First parameter is an array of objects with the following structure:
var data = date: 'Q1 - 2018' content: 'Lorem ipsum dolor sit amet' date: 'Q2 - 2018' content: 'Lorem ipsum dolor sit amet' date: 'Q3 - 2018' content: 'Lorem ipsum dolor sit amet' date: 'Q4 - 2018' content: 'Lorem ipsum dolor sit amet' ;
Options
Second parameter is an object of properties used to customize the timeline. Here's a list of all properties and it's default values:
;
eventsPerSlide
Sets the number of events per slide.
Default value: 6
slide
Sets the slide to show after initialization.
Default value: 1
rootClass
Allows you to change the css root class.
Default value: roadmap
prevArrow
Allows you to customize the "Previous" arrow. HTML is allowed.
Default value: prev
nextArrow
Allows you to customize the "Next" arrow. HTML is allowed.
Default value: next
orientation
Allows you to force the timeline orientation only to horizontal or vertical. Possible values are:
horizontal
,vertical
andauto
.
Default value: auto
onBuild
Allows you to pass a callback function that will run after the build
eventTemplate
Allows you to customize the event template. Use
####DATE###
and####CONTENT###
as tokens to show the events date and content.
Contributing
Check CONTRIBUTING.md for more information.
License
MIT License © Stefano Marra