1

我使用本教程来创建指南 http://www.hongkiat.com/blog/introjs-step-by-step-guide-tutorial/

$(function(){
  var introguide = introJs();
  // var startbtn   = $('#startdemotour');
}

introguide.setOptions({
    steps: [
        {
          element: '.nav-bar',
          intro: 'This guided tour will explain the Hongkiat demo page interface.<br><br>Use the arrow keys for navigation or hit ESC to exit the tour immediately.',
          position: 'bottom'
        },
        {
          element: '.nav-logo',
          intro: 'Click this main logo to view a list of all Hongkiat demos.',
          position: 'bottom'
        },
        {
          element: '.nav-title',
          intro: 'Hover over each title to display a longer description.',
          position: 'bottom'
        },
        {
          element: '.readtutorial a',
          intro: 'Click this orange button to view the tutorial article in a new tab.',
          position: 'right'
        },
        {
          element: '.nav-menu',
          intro: "Each demo will link to the previous & next entries.",
          position: 'bottom'
        }
    ]
});

但是我找不到方法或者我不明白:) 如何使用按钮或链接触发 introJs。另外，我在 Internet User's Guide 上进行了搜索，但没有找到足够的信息：(

我试过这个：

<a href = "javascript: void (0);" onclick = "javascript: introJs (). start ();"> Show me how </a>

&

<a class="btn btn-large btn-success" href="javascript:void(0);" onclick="startIntro();">Show me how</a>

但什么也没有发生

请帮我

4

1 回答 1

0

该示例就在您的教程页面上：

var startbtn   = $('#startdemotour'); // <-- you need to uncomment this line, or just use $('#startdemotour').on()
startbtn.on('click', function(e){
  e.preventDefault();
  introguide.start();
  $(this).hide();
});
于 2015-07-27T14:07:12.960 回答