A JavaScript/HTML5 library for step-by-step introduction
Intro.js
A JavaScript/HTML5 library for better new feature introduction and step-by-step users guide for websites and projects.
Documentation: http://introjs.com/docs/
Questions tagged [intro.js]
239 questions
20
votes
5 answers
Firing javascript function between intro.js steps
I am using Intro.js for a guided tour.
I would like to fire javascript functions between some of the steps but I don't manage to.
An idea would be to define different intros, and fire the javascript functions between the intros.
Is there a cleaner…
FredB
- 551
- 1
- 3
- 10
14
votes
4 answers
IntroJS Bootstrap Menu doesn't work
I'm using bootstrap for UI Design. I have configured updated IntroJS to my site.
Now it works fine with other elements but giving problem with Dropdown Menu Elements.
Ganesh Bhosale
- 2,000
- 18
- 21
13
votes
8 answers
Intro.js: highlighted area doesn't work as expected
I'm using the very interesting javascript library intro.js.
However, in my application, the highligted area becomes almost completely white.
I'm guessing that this is some CSS conflict, but what can I do to determine the cause of this problem?
pvieira
- 1,687
- 6
- 17
- 32
10
votes
2 answers
How can I make intro js work with React?
I am trying to use introJs with React but it seems not to work. How can I make it work? Can you give me an example?
user6915540
9
votes
7 answers
IntroJS callback function upon skip or done?
I'm using introjs to build a tour of my application. I've searched in quite a few places online and through the documentation but can't seem to find anywhere a method of how to run a function upon skipping or clicking done on the tour. I'm trying to…
Joe Scotto
- 10,936
- 14
- 66
- 136
9
votes
1 answer
how to start intro.js tour only on first visit to website
I have implemented intro.js to my website. But I wanted to start the tour only on first visit. may be by using cookies.. website is made with html no php..
Aroo
- 141
- 1
- 10
8
votes
1 answer
Make intro.js tooltip force to the right and make page scroll
When you add a large tooltip in intro.js, it calculates whether it has space to put the tooltip on the top, bottom, left, right by doing the following:
/*
* auto determine position
*/
// Check for space below
if (targetElementRect.bottom +…
Pranay Majmundar
- 803
- 7
- 15
8
votes
2 answers
Intro.js is opensource or not?
I started to using the useful Intro.js library in my project, but after few months use I updated it and found that the license changed on 08/03/2016.
The library is definitely open source and free software, but at the same time if I want use it for…
Alessandro
- 284
- 4
- 13
7
votes
1 answer
Adding the Intro.JS library to a Vue-Cli / Webpack project
I'm building my first project using vue-cli and webpack and I'm not sure how to properly use an external JavaScript library to my project.
I want to add the Intro.js library which simply requires me to import the intro.js, add some tags to some…
Daniel D
- 918
- 9
- 18
7
votes
1 answer
How can I make multipage intro by using Intro.js programmatic
Hello I just start learning with javascript and I would like to know how to make multipage intro by using intro.js
function beginer() {
var intro = introJs();
intro.setOptions({
steps: [
{
element:…
Thida
- 71
- 1
- 3
7
votes
2 answers
IntroJS scrolling not working
I'm using IntroJs on my page to show a tour. In general everything works fine, but theres one Problem:
On one page, IntroJS ist not able to scroll, because I have something like a div, that's scrolling on the div itself, so not the whole page is…
user5638730
- 495
- 2
- 9
- 22
7
votes
4 answers
Wait for DOM to be ready on an AngularJS directive
I'm building a "tour guide" for my angular powered website.
I looked around for options and Intro.js seemed like the best fit. It had an Angular Directive already ready and everything: Angular Intro.js.
Everything worked as expected, until I had to…
pedropeixoto
- 1,633
- 2
- 27
- 52
6
votes
1 answer
How do I fire a modal for the next step in my introjs?
So IntroJS works off of the data-intro and data-step attributes.
So for instance my logo looks like this:
marcamillion
- 32,933
- 55
- 189
- 380
marcamillion
- 32,933
- 55
- 189
- 380
6
votes
2 answers
Highlighting a new dom element using intro.js
I'm using intro.js for the 'tour' for my web app. Since I'm trying to make this a quite user - interactive tour, I'm allowing the users to interact with the highlighted DOM elements on various steps.
There is a table with rows and columns in my app.…
booleanhunter
- 5,780
- 4
- 16
- 21
6
votes
2 answers
How IntroJs achieve the highlighted areas?
Came across intro.js - a very cool way to guide users on how to use software interfaces. I havnt looked at the source in depth but was wondering if anyone could briefly explain what the code does to achieve the highlighted areas (specifically…
jaysmith024
- 118
- 2
- 9