8

我曾经看到一个 javascript 工具（可能是 jquery 插件）来实现功能/导游功能，不幸的是我没有为页面添加书签。

它使用了一个覆盖并专注于文档元素，可能基于 id 属性。

在此处输入图像描述

Joyride或我在谷歌上发现的任何东西都不支持这一点。

你有什么想法吗？

4

4 回答 4

5

Sideshow是一个现代且强大的库，用于为 Web 应用程序和站点创建交互式导览。

Sideshow 不仅可以指导您的用户，还可以与他们互动：

  • 通过屏蔽屏幕的其余部分（Sideshow 不为此使用 z-index 方法，它的掩码是'不定位在元素后面，而是真正围绕它）。
  • 监控用户的行为和某些屏幕的状态。
  • 为您的教程创建智能步骤，当满足某些条件时自动进行
  • 在您的教程之间创建关系，这样，当您的用户完成一些教程时，会显示一个包含相关教程的列表。
  • 使用 Markdown 丰富格式化步骤描述
  • 使用事件（例如 beforeStep/afterStep、beforeWizardStarts/afterWizardEnds）来执行一些准备或其他任何事情
  • 根据用户正在查看的屏幕显示上下文教程，每个教程都有自己的条件来检查它是否符合该屏幕的条件

和其他强大的功能！

于 2014-01-23T02:54:29.760 回答
3

Intro.js是一个更好的网站和功能介绍，为您的项目提供分步指南。

特征：

  • 键盘+鼠标导航
  • 又快又小
  • 浏览器兼容性
  • 免费和开源
于 2014-12-21T12:15:33.333 回答
0

jquerypowertour.com可以突出显示元素等等。我没有用过，但它看起来很强大。

但我认为像JoyRide或Guiders-JS这样的东西可以很容易地修改为与jQuery Highlighter 插件结合使用- Demo

于 2013-01-06T15:59:59.763 回答
0

在这个时间点，我很可能会为此目的选择Shepherd 。（不过，Intro 和 Sideshow 将紧随其后。）

代码很干净，它有很好的默认样式，很容易替换，注意使其易于访问并提供键盘支持，并且它与多个框架集成：

  • 反应
  • 角
  • 余烬
  • Vue
  • Rails（通过亚伯拉罕）
  • 可能是我不知道的其他人

当然，它也适用于 vanilla JS 或 ES 模块。

此外，它不需要 jQuery。需要 jQuery 的一切似乎都是 2005 年的事。

于 2021-01-15T01:58:01.450 回答