2

I want to change button text for each steps.I did with below method but text is not changing .Should i call refresh() method after setOptions ? Or i am doing with wrong way ?.

var intro = introJs();
  intro.setOptions({
       steps: [
            {
                 intro:$('#intro_start').get(0).outerHTML,

             },
             {
               element:document.getElementById('intro_left_menu'),
                 intro: $('#intro_left_menu_html').get(0).outerHTML,
                 position: 'right'
             },
              {
                     element:document.getElementById('intro_top_right_menu'),
                        intro: $('#intro_top_right_menu_html').get(0).outerHTML,
                       position: 'left'
               },
              {
                   element:document.getElementById('intro_top_setting_menu'),
                  intro: $('#intro_top_setting_menu_html').get(0).outerHTML,
                    position: 'left',
              },
               {
                    intro:$('#intro_start_center_html').get(0).outerHTML
               }
            ],
   });
  intro.start();

After Intro start I want to change text of nextLabel and prevLabel with onChange event for each steps:

      intro.onbeforechange(function(targetElement) {
             switch (intro._currentStep){
                 case 1:
                        intro.setOptions({ 'nextLabel': 'Step1 Next' , 'prevLabel': 'Step1 Back'});
                        break;
                  case 2:
                        intro.setOptions({ 'nextLabel': 'Step2 Next' , 'prevLabel': 'Step2 Back'});
                         break;
                }
    }

Here is official Demo Link.Here if we can setOption('showBullets', false)) Or setOption('showBullets', true)) for different steps ?

Arif Hussain
  • 147
  • 1
  • 15

0 Answers0