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

Question

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 console, modify css style. 2. Survey from GitHub forum and Stackoverflow

But it's still not work

In home.html

<ion-content center padding> 
     <p id="step1">First Step</p>
</ion-content>

In home.ts

constructor(public navCtrl: NavController,
          ....) {
}

ionViewDidEnter(){
  this.intro();
}

intro() {
    let intro = introJs.introJs();
    intro.setOptions({
        steps: [
            {
                intro: "Hello world!"
            },
            {
                element: '#step1',
                intro: "This is a tooltip.",
                position: 'bottom'

            }             
        ],
    });
    intro.start();
}

The first pic is the same because that step doesn't attach to any html element.

In Android Device, the result is like below

But in iOS Device, the result is like below

Answer 1

For solving the back screen (black color) you can give style in index.html page before the body tag closes. .introjs-fixParent { z-index: 99999 !important; } It's coz of the z-index, but still, in ionic 3 there were a lot of issues related to other stuff also, I am stuck with the scrollToElement issue.

Hope this Helps