4 ms·
Tour.js – Touring and on-boarding for JavaScript applications
- tannerlinsley 10y agoIt's time for better onboarding tools in web apps. Tour will leave your users wanted more. - Supports single page apps, and complex scrollable content - Responsive & Intelligent - Automagic Tooltip Positioning, it just works. - Promise Driven Events & Hooks for fine-grained control - It's very lean for the features it has. 12k gzipped. - Most importantly, Tour does not restyle, change z-indices, or manipulate your DOM elements in any way Give it a try! The beta is already available on NPM CDN: https://npmcdn.com/tour@latest/dist/tour.js https://npmcdn.com/tour@latest/dist/tour.js https://npmcdn.com/tour@latest/dist/tour.css https://npmcdn.com/tour@latest/dist/tour.css ----- Quick JS Demo ----- import Tour from 'tour' const myTour = { canExit: true, steps: [{ target: '#first-element', content: 'This is the first step!', }, { target: '.some .other .element', content: 'Blah blah blah. I prefer to show up on the right.', }, { target: '#menu-element', content: 'I guess this is a menu!', }, { target: '#last-element', content: 'It is over! :(', }], }; Tour.start(myTour) .then(() => { console.log('Tour Finished!'); }) .catch(() => { console.log('Tour Interrupted!') }); ------------------------
- jsonmaur 10y agoAwesome! Love that it doesn't manipulate the DOM at all... that's really clever.