如何在不将任何元素集中在 intro.js 上的情况下显示工具提示答案

【问题标题】：how do i show a tooltip without focusing any element on intro.js如何在不将任何元素集中在 intro.js 上的情况下显示工具提示
【发布时间】：2014-10-02 23:24:43
【问题描述】：

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

咖啡js：

intro.setOptions 步骤：[ 元素：“randomXyzselectorThatDoesntExistinPage” intro : "欢迎来到 Create New Booking Tour，请按照分步指南清楚了解流程

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

" 位置：“底部” , 元素：“.userContainer” intro : “首先，让我们搜索一下客人是否已经存在于我们的记录中单击下一步按钮开始游览” 位置：“底部” , 元素：“.availabilityContainer” 介绍：“现在，让我们检查我们的客人需要入住日期的 OYO 的可用性，然后选择其中一个可用的 OYO 进行预订” 位置：“底部” , 元素：“.overlayIntrojs” intro : "在这些日期的可用 OYO 中选择一个 OYO 后，让我们选择房间数量、房间类型、加床、额外人数、折扣和其他有关预订的基本信息" 位置：“顶部” , 元素：“.introJsSel4” 简介：“付款详情部分！，通过输入付款方式、支付金额、付款参考号等付款详情继续确认预订” 位置：“顶部” ] intro.setOption "doneLabel", "完成" intro.start().oncomplete -> window.location.href = "/admin/bookings/36" 返回

屏幕截图：

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

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

【问题讨论】：

标签： ruby-on-rails twitter-bootstrap-3 tooltip intro.js

【解决方案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

【讨论】：