• slide tutorial [[http://abcnews.go.com/images/Business/ht_slide_tester_1_dm_130425_wblog.jpg]]

*** Setup:

Create a new SlideTutorial and pass in an object with a 'slides' array of objects. Objects should have 'image', 'title', and 'content' keys.

+begin_src javascript

var slideTutorial = new SlideTutorial({slides: [ {image: './your-image-1.jpg', title: 'Welcome', content: 'Some content'}, {image: './your-image-2.jpg', title: 'Second Slide', content: 'Some more content'}, {image: './your-image-3.jpg', title: 'Third Slide', content: 'Some more content'} ]});

+end_src

Call the start method when you want it to open

+begin_src javascript

slideTutorial.start()

+end_src

*** Customize:

Pass in optional 'nextButtonText', 'finishButtonText', and 'closeButtonText' keys to the constructor to override the default text. These set the innerHTML directly, so feel free to pass in icons and other tags as well. 'constantHeight can also be set to ensure slides are all the same height for variable content lengths.

+begin_src javascript

var slideTutorial = new SlideTutorial({ slides: [ {image: './your-image-1.jpg', title: 'Welcome', content: 'Some content'}, {image: './your-image-2.jpg', title: 'Second Slide', content: 'Some more content'}, {image: './your-image-3.jpg', title: 'Third Slide', content: 'Some more content'} ], nextButtonText: 'Continue', finishButtonText: 'Get Started', closeButtonText: 'Exit', constantHeight: true });

+end_src

*** Example:

+begin_src

npm run build && open ./example/custom.html

+end_src