Использование Intro.js - данных интро

Question

настоящее время я использую Intro.js для моего сайта и код работает здесь

<h2 data-step="1" data-intro="Welcome message!">Welcome back</h2> 

Я хотел поставить эту кнопку в режиме воспроизведения аудио в теге данных-интро, как я это делаю?

<a onclick="this.firstChild.play()" ><audio src="Audio/WelcomeBack.wav"></audio>▸ </a> 

Я пытался что-то вроде

<h2 data-step="1" data-intro="Welcome message! <a onclick="this.firstChild.play()" ><audio src="Audio/WelcomeBack.wav"></audio>▸ </a>">Welcome back</h2> 

Но это не читает тег.

К сожалению, я еще новичок и нуждаются в помощи здесь :)

Answer 1

Для того, чтобы сделать эту работу, вы должны использовать программное Defining с помощью JSON.

Например:

var intro = introJs(); 
     intro.setOptions({ 
     steps: [ 
      { 
      element: '#step1', 
      intro: "This is a <b>bold</b> tooltip." 
      }, 
      { 
      element: '#step2', 
      intro: "Ok, <i>wasn't</i> that fun?", 
      position: 'right' 
      }, 
      { 
      element: '#step3', 
      intro: 'More features, more <span style="color: red;">f</span><span style="color: green;">u</span><span style="color: blue;">n</span>.', 
      position: 'left' 
      }, 
      { 
      element: '#step4', 
      intro: "<span style='font-family: Tahoma'>Another step with new font!</span>", 
      position: 'bottom' 
      }, 
      { 
      element: '#step5', 
      intro: '<strong>Get</strong> it, <strong>use</strong> it.' 
      } 
     ] 
     }); 

     intro.start(); 

Смотрите этот пример для получения дополнительной информации: http://usablica.github.io/intro.js/example/html-tooltip/index.html