Question

我正在使用intro.js进行产品导览。我想显示工具提示而不关注任何元素，如“欢迎来到XYZ之旅”。我想只使用bootstrap和介绍js，我不想使用任何警报，弹出窗口...任何解决方案intro.js选项在这里我附加截图..我能够达到它，如果我帮助一些随机选择器价值，但我想要一个干净，公平的代码

coffee js：

intro.setOptions步骤：[ element：“randomXyzselectorThatDoesntExistinPage” 简介：“欢迎来到创建新预订之旅，请按照分步指南清楚地了解流程

点击”下一步“按钮开始游览

” 位置：“底部” ，元素：“。userContainer” 简介：“首先，让我们在记录中搜索来宾

点击下一步按钮开始游览

” 位置：“底部” ， element：“.availabilityContainer” 简介：“现在，让我们检查OYO的可用性，了解我们的客人需要停留的日期，并选择其中一个可用的OYO进行预订” 位置：“底部” ，元素：“。overlayIntrojs” 介绍：“在这些日期的可用OYO中选择OYO之后，我们可以选择房间数量，房间类型，加床，额外人员，折扣和其他有关预订的基本信息

” 位置：“顶部” ，元素：“。introJsSel4” 简介：“付款细节部分！”，通过输入付款方式确认预订，如付款方式，付款金额，付款参考编号等“ 位置：“顶部” ] intro.setOption“doneLabel”，“完成” intro.start（）。oncomplete - ＆gt; window.location.href =“/ admin / bookings / 36” 返回

SCREENSHOT：

[IMG] http://i59.tinypic.com/2zges2b.jpg[/IMG]

我希望将第一个工具提示显示为一些欢迎消息，而不是直接浏览幻灯片...... 我想要我在上面的图像中显示的内容，而不必在步骤中给出一些随机选择器，但是以明确的introjs支持方式

Answer 1

您需要使用以下步骤的程序化定义：

    var intro = introJs();
      intro.setOptions({
        steps: [
          { 
            intro: "Hello world!"
          },
          { 
            intro: "You <b>don't need</b> to define element to focus, this is a floating tooltip."
          }
        ]
      });

      intro.start();

以下是一个示例：https://github.com/usablica/intro.js/blob/master/example/withoutElement/index.html

如何在不将任何元素聚焦在intro.js上的情况下显示工具提示

1 个答案: