Closed DamienCassou closed 6 months ago
In https://github.com/usablica/intro.js/issues/1377#issuecomment-904603378, it was suggested to use onbeforechange() to change the style of individual steps. So I'm trying something like this:
onbeforechange()
intro.onbeforechange(function () { console.log("tooltip", document.querySelector(".introjs-tooltip")); });
The problem is that onbeforechange() is called before the tooltip is displayed so document.querySelector() returns null for the first step:
document.querySelector()
null
As you can see, when onbeforechange() is first called, I get null. It is only after I clicked "Next" that I got the tooltip.
I would like a way to customize the style of the first step in the wizard to make it larger.
The first step can't be customized because onbeforechange() is called before any tooltip is rendered.
This can be reproduced with the example/callbacks/onbeforechange.html example:
example/callbacks/onbeforechange.html
diff --git a/example/callbacks/onbeforechange.html b/example/callbacks/onbeforechange.html index d510ac1..0789a50 100644 --- a/example/callbacks/onbeforechange.html +++ b/example/callbacks/onbeforechange.html @@ -72,10 +72,7 @@ function startIntro(){ var intro = introJs(); intro.onbeforechange(function () { - if (this.currentStep() === 2) { - alert('You cannot continue! :P') - return false; - } + console.log("tooltip", document.querySelector(".introjs-tooltip")); }); intro.start(); } -- 2.41.0
I guess something like https://github.com/usablica/intro.js/pull/1266 could solve my issue. I don't know any other workaround.
This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.
This is still a problem for us.
Description
In https://github.com/usablica/intro.js/issues/1377#issuecomment-904603378, it was suggested to use
onbeforechange()
to change the style of individual steps. So I'm trying something like this:The problem is that
onbeforechange()
is called before the tooltip is displayed sodocument.querySelector()
returnsnull
for the first step:As you can see, when
onbeforechange()
is first called, I getnull
. It is only after I clicked "Next" that I got the tooltip.Expected Behavior
I would like a way to customize the style of the first step in the wizard to make it larger.
Actual Behavior
The first step can't be customized because
onbeforechange()
is called before any tooltip is rendered.Errors and Screenshots (optional)
This can be reproduced with the
example/callbacks/onbeforechange.html
example:Workaround
I guess something like https://github.com/usablica/intro.js/pull/1266 could solve my issue. I don't know any other workaround.