Questions tagged [intro.js]

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.

http://introjs.com/

Documentation: http://introjs.com/docs/

Github: https://github.com/usablica/intro.js

239 questions
0
votes
1 answer

Is there a prop available to call a function when close button (cross icon) is clicked for introjs-react step?

I'm pretty new to introjs-react. I have gone through the documentation and know there are 2 props available onExit and onComplete. The previous is called when we skip a step (for example when clicking outside the step on the overlay) and the latter…
Ayesha Iftikhar
  • 1,028
  • 2
  • 11
  • 27
0
votes
1 answer

How do I make it so introjs adheres to slides?

I have a modal with multiple slides in it. Each slide contains it's own form.
Kyle Corbin Hurst
  • 917
  • 2
  • 10
  • 26
0
votes
1 answer

Is there a way to use a sweetAlert.js for confirm instead of the standard in the method during onbeforeexit()

I am trying to use sweet alert to as a replacement for the standard JavaScript confirm dialog box. The issue I am experiencing is when I return the promise the method does not wait for the response it simply ends the tour. I would like to see this…
Jared Gibb
  • 47
  • 5
0
votes
1 answer

onbeforechange results in error after last step in intro.js

I need to trigger a change to the page before a step loads. (Specifically, I need to trigger a menu to open before the next step; the next step will highlight that open menu.) I am using introJS.onbeforechange() to accomplish this, which works…
user1821431
  • 63
  • 10
0
votes
0 answers

Rintrojs - widening the tooltips

Is there a way to widen the tooltips in Rintrojs? This is what I tried: library(shiny) library(rintrojs) ui <- shinyUI(fluidPage( introjsUI(), mainPanel( textInput("intro","Enter an introduction"), actionButton("btn","Press me") …
Vlad
  • 3,058
  • 4
  • 25
  • 53
0
votes
0 answers

I am using intro js angular 8 and select option is not working

When I click on the select option it the options are behind the introjs. How to bring it to the top?
Midhilaj
  • 4,905
  • 9
  • 45
  • 88
0
votes
1 answer

How to work with multiple components in intro js for react

I'm using introjs-react package for my project but I'm facing a problem of interacting with multiple components..... As it is not able to select element which is not being rendered at first but at second step I'm rendering component on the screen…
0
votes
1 answer

Add new button to tooltip area

I need to add new button or checkbox in order to disable the tour in general for my app. Is it possible add new button into tooltip and catch click on it in order to disable the door forever? Thanks Luca
Luca Santaniello
  • 161
  • 1
  • 11
0
votes
0 answers

Intro JS for multiple components in React JS

My react page has multiple components (navigation bar, image slider, popular list, etc..), so each component has separate files. so how can I use Intro JS for those components? I put all the steps in the navigation bar, but it only works for the…
0
votes
2 answers

introJS - ignore hidden or DOM elements that don't exist

I am using introJS in Angular 7. I have the following set up option: introJS = introJs(); this.introJS.setOptions({ tooltipPosition: 'auto', positionPrecedence: ['left', 'right', 'top', 'bottom'], showBullets: true, …
Jake
  • 25,479
  • 31
  • 107
  • 168
0
votes
1 answer

How to create a guided tour in Rails with gem 'intros-rails'

Been working on this for a few days, I'm trying to use gem "introjs-rails" to create a guided tour in rails. https://github.com/heelhook/intro.js-rails. A few differences between whats below and what the guide asks for are the guide wants '//=…
ChrisWilson
  • 459
  • 1
  • 6
  • 19
0
votes
1 answer

D3 tooltip barely visible when using intro.js

I'm using D3 to create a series of circles that each have a tooltip via D3 onmouseover. I'm also using introJs as a tour to provide some commentary about the data. When the tour is running and the introJs tooltip is in view, the D3 tooltips are…
0
votes
1 answer

Intro.js steps no show in iOS device in ionic 3

In Ionic 3, I use choose Intro.js to implement new-user touring. But when I use iOS simulator and device to check the result, div with class 'introjs-overlay' turns out black (see below pics). I've tried lots of solutions like 1. Check from chrome…
Adamlin0708
  • 131
  • 10
0
votes
1 answer

How to target an item inside ngFor with introjs

I need to use introjs to tour new features on an angular 6 app. Inside the tour some step target items in ngFor in a child component of the component where I start introjs. The library is able to target child component html elements but seems to not…
Dylan Tuna
  • 85
  • 2
  • 6
0
votes
1 answer

How to get rid of progress-indicator?

I am trying to launch a mini-popups via JS for a specific control. Ok, I admit that sort of defeats the purpose of intro, but on that page there is really one control only that would "deserve" this treatment. So the navigation-controls, numbers and…
MBaas
  • 7,248
  • 6
  • 44
  • 61