チュートリアルの最終ステップ後にステートを追加したい

『サイトで簡易的なチュートリアル施策を実施する_v3.0』(https://support.karte.io/post/4CeyJfriCwNcF2Ps1RecIC)
の最終ステップ終了後に、stateを切り替えたいのですが、単純にonNext内に書いただけでは動きません。
どのように書いたらよいでしょうか?
例:

      // 最後のステップ完了でイベントを発火
      onNext: function() {
        setState(2); //追加
        tracker.track(‘tutorial_finish’);
      }
1 Like

widget.setState(2) にしてみてください!

ありがとうございます。早すぎてびっくりしました。

1 Like

丁度見てましたw

1 Like

こちらの案件に続けて質問させてください。

①ステップを切り替えた際、対象の要素下に
『div#driver-highlighted-element-stage』 が敷かれますが、これを、ステップごとに色を変えるようなことは可能でしょうか?

#driver-page-overlay』(黒い半透明)をタッチ(クリック)した際に、クローズしてしまうのを止めたいのですが、可能ですか?

①おそらく、CSSの調整でできそうなきがしますねー。
②仕様は以下なのですが、
https://kamranahmed.info/driver.js/

overlayClickNext はもしかしたら使えるかもです!
allowClose これもいけそう

ありがとうございます。試させていただきます。

ステップごとに色を変える

こちらに関してCSSの変更の場合、全てが変わる方法しか思いついておらず難儀しております。
具体的にどう変えるべきかなどありましたらご教示いただけますと幸いです。

やり方はいろいろありそうですが
KARTE関係なく、StyleをJavascriptで直接書き換えてしまうのが一番シンプルそうです。

この辺が参考になりそうです!

1 Like

こちらのチュートリアルに関してご相談になります。
現在iPadとiPadminiで検証をしているのですが、iPadminiの場合iPadと異なり文字が隠れてしまうのですがこちらは仕様になりますでしょうか?

ブラウザのposition と z-indexの受け取り方の違いから起きてる問題みたいですね・・!


こいつをWrapして提供しているのですが、一般的なデバイスでの確認は行ったのですが
サイトの作りによっては、問題が発生するケースもあるみたいです。

サイトの構造にも依存してるみたいで、状況の再現が難しいのですが、
以下追加したらなおったりしないですかね??

    .driver-fix-stacking {
      position: relative !important;
    }

ご対応ありがとうございます。
こちら確認させていただきます。